<!DOCTYPE html>
<html lang="en">
<head>
    <title>应急管理综合监管平台</title>
    <link rel="stylesheet" href="../../../assets/theme-chalk/index.css">
    <link rel="stylesheet" href="../../../style.css">
    <meta charset="utf-8">
    <link rel="shortcut icon" href="../../../favicon.ico">
    <!--<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.3.3/video-js.css" ref="stylesheet">-->
    <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.3.3/video.js"></script>-->
    <style>
        #allmap {
            width: 100%;
            height: 100%;
            overflow: hidden;
        }
        .el-tabs__nav-scroll{
            background: transparent;
        }
        .list_lh {
            height: 100%;
            overflow: hidden;
        }

        ::-webkit-scrollbar { /*滚动条整体样式*/
            width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
            height: 1px;
        }

        ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
            border-radius: 10px;
            -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
            /*background: @borderColor;*/
            background: #409EFF;
        }

        ::-webkit-scrollbar-track { /*滚动条里面轨道*/
            -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
            border-radius: 10px;
            background: transparent;
        }

        .list_lh * {
            margin: 0;
            padding: 0
        }

        .list_lh li, .list_lh_header p {
            padding: 5px;
        }

        .list_lh li p, .list_lh_header p {
            height: 24px;
            line-height: 24px;
            display: flex;
            color: #333;
            font-weight: 700;
        }

        .list_lh li p > span:nth-of-type(2), .list_lh_header p > span:nth-of-type(2) {
            flex: 2;
            /*ellipsis;*/
            overflow: hidden;
            text-align: center;
            white-space: nowrap;
        }

        .list_lh li p > span:nth-of-type(1), .list_lh_header p > span:nth-of-type(1) {
            flex: 2;
            width: 100px;
            /*ellipsis;*/
            overflow: hidden;
            white-space: nowrap;
        }

        .list_lh li p > span:nth-of-type(3), .list_lh_header p > span:nth-of-type(3) {
            width: 100px;
            text-align: center;
        }

        .list_lh li p em {
            width: 80px;
            font: normal 12px/24px Arial;
            color: yellow;
            float: right;
            display: inline-block;
        }

        .list_lh li p span {
            float: right;
            color: yellow;
            font-weight: 700;
        }

        .list_lh_header p span {
            text-align: left;
        }

        .list_lh li p a.btn_lh {
            background: #28BD19;
            height: 17px;
            line-height: 17px;
            color: #333;
            padding: 0 5px;
            margin-top: 4px;
            display: inline-block;
            float: right;
        }

        .page {
            width: 100%;
            height: 100%;
        }

        .text {
            font-size: 14px;
        }

        .item {
            padding: 18px 0 0 0;
        }

        .toolbtn {
            position: absolute;
            top: 30px;
            left: 50px;
            z-index: 99;
        }

        .tooltipDiv {
            position: absolute;
            top: 100px;
            left: 50px;
            z-index: 99;
        }

        .square {
            border: 1px solid #fff;
            margin-top: 10px;
            font-size: 15px;
        }

        .anchorBL {
            display: none;
        }

        .line_div {
            position: fixed;
            /*width: 200px;*/
            z-index: 999;
            height: 30px !important;
            margin-top: 10px;
        }

        .notice_div {
            position: fixed;
            z-index: 999;
            right: 20px;
            top: 40px;
        }

        .alarm_div {
            position: fixed;
            z-index: 999;
            right: 10px;
            bottom: 20px;
            width: 400px;
            background: url(../../../imgs/bg1_3.png) no-repeat;
        }

        .el-form-item__label {
            color: white;
        }

        .alarm_box {
            z-index: 999;
            position: absolute;
            right: 10px;
            top: 70px;
            width: 400px;
            height: 25%;
            /*background: #0F517D;*/
            background: url(../../../imgs/bg1_3.png) no-repeat;
            background-size: cover;
        }

        .alarm_box_center {
            z-index: 999;
            position: absolute;
            right: 10px;
            top: 35%;
            height: 30%;
            width: 400px;
            /*background: #0F517D;*/
            background: url(../../../imgs/bg1_3.png) no-repeat;
            background-size: cover;
        }

        .alarm_box_left {
            z-index: 999;
            position: absolute;
            left: 50px;
            top: 70px;
            color: aqua;
            width: 400px;
            font-size: small;
            /*background: #0F517D;*/
            background: url(../../../imgs/bg1_3.png) no-repeat;
            background-size: cover;
        }

        .alarm_box_left p {

        }

        .alarm_box_left_bottom {
            z-index: 999;
            position: absolute;
            left: 50px;
            bottom: 20px;
            height: 30%;
            color: aqua;
            width: 400px;
            font-size: small;
            /*background: #0F517D;*/
            background: url(../../../imgs/bg1_3.png) no-repeat;
            background-size: cover;
        }

        .alarm_box_left_center {
            z-index: 999;
            position: absolute;
            left: 50px;
            top: 220px;
            color: aqua;
            height: 30%;
            width: 400px;
            font-size: small;
            /*background: #0F517D;*/
            background: url(../../../imgs/bg1_3.png) no-repeat;
            background-size: cover;
        }

        .el-menu {
            border-right: 0
        }

        .box-tit {
            margin-left: 0;
            padding-left: 10px;
            padding-top: 10px;
            display: inline-block;
            color: #00c5cc;
            cursor: pointer;
        }

        .table {
            width: 90%;
            margin: 15px auto;
            color: #fff;
            font-size: 14px;
        }

        .table .number {
            background: #0a304b;
            color: #ca595c;
            font-size: 12px;
            font-style: normal;
        }

        .table i {
            display: inline-block;
            width: 20px;
            height: 20px;
            text-align: center;
            line-height: 20px;
            background: #ca595c;
            border-radius: 4px;
        }

        .el-dialog {
            background: #01253f;
            box-shadow: #0D5887 0px 0px 10px 5px;
            opacity: 1;
        }

        .el-dialog__title {
            color: #FFC526;
        }

        .el-dialog__body {
            padding-top: 0px;
            color: #fff;
        }

        .chart-outer {
            background: transparent;
        }

        .company .nr {
            border-radius: 3px;
            overflow: hidden;
            background: url(../../../imgs/zheJTP.png) no-repeat;
            height: 100%;
            display: flex;
            padding-left: 10%;
            padding-right: 2%;
        }

        .todayWarning {
            background-image: linear-gradient(-45deg, #ff7ea2, #ff466d);

            box-shadow: 0px 5px 20px 0px rgba(255, 98, 139, 0.5);
            margin-right: 2.29%;
            cursor: pointer;
            flex: 1;
            height: 120px;
            border-radius: 10px;
            color: white;
            font-size: 14px
        }

        .todayWarning .nr {
            height: 100%;
            background: url(../../../imgs/zheJTP.png) left center no-repeat;
            padding: 14px 6% 0;

        }

        .yesterdayWarning {
            background-image: linear-gradient(-45deg, #e6c65c, #d19d28);
            border-radius: 10px;
            margin-right: 2.29%;
            box-shadow: 0px 5px 20px 0px rgba(222, 182, 62, 0.5);
            cursor: pointer;
            flex: 1;
            height: 120px;
            color: white;
            font-size: 14px
        }

        .yesterdayWarning .nr {
            height: 100%;
            background: url(../../../imgs/zheJTP.png) left center no-repeat;
            padding: 14px 6% 0;

        }

        .four_map {
            position: absolute;
            top: 10px;
            left: 10px;
            z-index: 999;
        }

        .todayProduce {
            flex: 1;
            height: 120px;
            border-radius: 10px;
            color: white;
            font-size: 14px;
            background-image: linear-gradient(-45deg, #b789e9, #753bcb);
            box-shadow: 0px 5px 20px 0px rgba(156, 98, 222, 0.5);
            margin-right: 2.29%;
            cursor: pointer;
        }

        .todayProduce .nr {
            height: 100%;
            background: url(../../../imgs/zheJTP.png) left bottom no-repeat;
            padding: 14px 6% 0;
        }

        .yesterdayProduce {
            flex: 1;
            height: 120px;
            border-radius: 10px;
            color: white;
            font-size: 14px;
            background-image: linear-gradient(-45deg, #6ed97f, #38bb46);
            box-shadow: 0px 5px 20px 0px rgba(81, 206, 99, 0.5);
            cursor: pointer;
        }

        .yesterdayProduce .nr {
            height: 100%;
            background: url(../../../imgs/zheJTP.png) left bottom no-repeat;
            padding: 14px 6% 0;
        }

        .kaihu {
            flex: 1;
            height: 120px;
            border-radius: 10px;
            color: white;
            font-size: 14px;
            background-image: linear-gradient(-45deg, #50c2fa, #1384f3);
            box-shadow: 0px 5px 20px 0px rgba(46, 170, 254, 0.5);
        }

        .tBT {
            display: flex;
            align-items: center;
        }

        .u-marginBottom7 {
            margin-bottom: 7px !important;
        }

        .u-marginBottom0 {
            margin-bottom: 0px !important;
        }

        .u-paddingTop32 {
            padding-top: 32px;
        }

        .u-floatRight {
            float: right !important;
        }

        .u-textAlignRight {
            text-align: right !important
        }

        .shuX {
            display: inline-block;
            width: 3px;
            height: 12px;
            background: #0091ea;
            margin-right: 5px;
        }

        .dat {
            font-size: 26px;
        }

        .flex {
            display: flex;
        }

        .box {
            flex: 1;
            text-align: center;
        }

        .chart-wrap {
            background: darkgrey;
        }

        /**
         el 标签
         */
        .el-pagination__total {
            color: white
        }

        .el-tabs--card > .el-tabs__header .el-tabs__item {
            border-bottom: 0px
        }

        .el-tabs--card > .el-tabs__header {
            border-bottom: 0px
        }

        .el-tabs--card > .el-tabs__header .el-tabs__nav {
            border: 0px;
        }

        .el-tabs__item {
            color: #409EFF;
            font-size: 18px;
        }

        .el-tabs--card > .el-tabs__header .el-tabs__item {
            border-left: 1px solid #00c5cc
        }
        .el-tabs__nav-next, .el-tabs__nav-prev{
            font-size: 30px;
            color: cornflowerblue;
        }
        .el-tabs__item.is-active {
            color: #00c5cc;
        }

        .el-col {
            border-radius: 4px;
        }

        el-tab-pane span {
            width: 150px;
        }

        .el-collapse-item__header {
            background: #1cbbb4;
            color: white;
            font-size: 20px;
            padding-left: 20px;
        }

        .company_detail_dialog .el-tabs__content {
            min-height: 620px;
        }

        .text {
            font-size: 14px;
        }

        .paramSpan {
            font-size: 18px;
            cursor: pointer;
        }

        .devSpan {
            top: 40px;
            position: relative;
            white-space: nowrap;
        }

        .panel {
            padding: 10px;
            border: solid 1px #D8D8D8;
            background: #fff;
            margin-bottom: 20px;
        }

        .panel .panel-title {
            border-bottom: solid 1px #D8D8D8;
            padding-bottom: 5px;
            margin-bottom: 10px;
        }

        .panel-f {
            text-align: center;
            color: #485465;
            width: 83%;
            background: #BDD0DD;
            border-radius: 5px;
            border: 0px;
            height: 60px;
            padding-top: 5px;
        }

        .panel-f p {
            margin-bottom: 0px;
            white-space: nowrap;
        }

        .panel-f h5 {
            font-weight: 700;
            margin-top: 10px;
        }

        .panel-f:last-child {
            margin-right: -5px;
        }

        .attr {
            margin: 0px;
            padding: 0px;
            /* float: left; */
            border: solid 2px #9699A4;
            width: 70%;
            border-radius: 10px;
            overflow: hidden;
            padding: 10px;
            margin: 20px;
            font-size: 15px;
            line-height: 40px;
        }

        li {
            list-style-type: none;
        }

        .paramDiv {
            width: 100%;
            height: auto;
        }

        .deviceInfo {
            height: 300px;
        }

        .company_asset .el-range-editor.el-input__inner {
            background: transparent;
        }

        .company_asset .el-date-editor .el-range-input {
            background: transparent;
            color: white;
        }

        .company_asset .el-date-editor .el-range-separator {
            color: white;
        }

        .company_asset .el-input__inner {
            background: transparent;
        }

        .company_asset .el-form-item__label {
            color: white;
        }

        .company_asset .el-table .warning-row {
            background: #080d20;
            color: #1874dd;
            font-size: 16px;
        }

        .company_asset .el-table--enable-row-hover .el-table__body tr:hover > td {
            background: #18456c;
        }

        .company_asset .el-table .success-row {
            background: #080d20;
            color: #1874dd;
            font-size: 16px;
        }

        .company_asset .el-table .dark-blue {
            background: #080d20;
            color: #1874dd;
            font-size: 18px;
            font-weight: 900;
        }

        .company_asset .el-table__body {
            height: 100%;
        }

        .company_asset .el-table td, .el-table th.is-leaf {
            border-bottom: 0;
        }

        .company_asset tr td:first-child {
            width: 100px;
        }

        .company_asset .el-table--fit {
            background: transparent;
        }

        .top {
            text-align: center;
        }

        .left {
            float: left;
            width: 60px;
        }

        .right {
            float: right;
            width: 60px;
        }

        .bottom {
            clear: both;
            text-align: center;
        }

        .control_item {
            margin: 4px;
        }

        .left .el-tooltip__popper,
        .right .el-tooltip__popper {
            padding: 8px 10px;
        }

        .red {
            border-radius: 5px;
            color: #FFF;
            background-color: #e80505;
            border-color: #F56C6C;
        }
    </style>
</head>
<body style="overflow: hidden;">
<div class="page" id="page-monitor" style="display: none">
    <div :style="{height:(height)+'px'}" class="line_div">
        <el-form :model="form" ref="form" :inline="true" >
            <el-form-item label="企业名称:" prop="projectName" label-width="120px">
                <el-input v-model="form.projectName" autocomplete="off"></el-input>
            </el-form-item>


            <el-form-item label="区:" prop="local" label-width="40px">
                <el-select v-model="form.zone" @change="zoneChange" style="width:202px">
                    <el-option v-for="item in zoneArr" :label="item" :value="item">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>



                <el-button type="primary" @click="search">查询</el-button>
                <el-button @click="handleCommand('bast_danger')" style="background: red;color: white ;border: red">
                    重大危险源企业
                </el-button>
                <!--<el-button type="warning" @click="getReport">当日告警分析</el-button>-->
                <el-dropdown split-button type="warning" @command="handleCommand">
                    综合分析
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item command="danger_count">风险点统计</el-dropdown-item>
                        <el-dropdown-item command="company_danger_count">企业风险级别统计</el-dropdown-item>
                        <el-dropdown-item command="danger_trends">风险趋势</el-dropdown-item>
                        <el-dropdown-item command="accident_count">事故信息统计</el-dropdown-item>
                        <el-dropdown-item command="alarm_analysis">风险告警统计</el-dropdown-item>
                        <el-dropdown-item command="today_alarm">当日告警情况</el-dropdown-item>
                    </el-dropdown-menu>
                </el-dropdown>

                <el-dropdown split-button type="success" @command="handleCommand">
                    风险评价
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item command="company_assess">企业评价</el-dropdown-item>
                        <!--<el-dropdown-item command="provider_assess"> 服务商评价</el-dropdown-item>-->
                    </el-dropdown-menu>
                </el-dropdown>


                <el-dropdown split-button type="danger" @command="handleCommand">
                    综合查询
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item command="alarm_list">告警查询</el-dropdown-item>
                        <el-dropdown-item command="dev_list"> 设备查询</el-dropdown-item>
                        <el-dropdown-item command="notice_list"> 推送查询</el-dropdown-item>
                    </el-dropdown-menu>
                </el-dropdown>
                <el-button style="background: blue;color: white ;border: red">
                    <el-link href="https://iot.hzcando.com"  style="color: white"  target="_blank">智慧用电</el-link>
                </el-button>
            </el-form-item>
        </el-form>
    </div>

        <div id="allmap" :style="{height:(height)+'px'}"></div>

        <div class="alarm_div" style="height: 180px;">
            <div class="list_lh_header">
                <p style="border-bottom:2px solid rgba(23,40,90,0.8);color: aqua;">
                    <span>企业名称</span><span>巡检任务总数</span><span>完成率%</span>
                </p>
            </div>
            <div class="list_lh notice" style="height: 80%">
                <ul id="notice">
                </ul>
            </div>
        </div>

        <div class="alarm_box row2-1">
            <span class="box-tit" @click="handleCommand('warning')">当月隐患数量　　查看详情>></span>

            <div id="main" style="height:90%;"></div>
        </div>

        <div class="alarm_box_center row2-1">
            <span class="box-tit" @click="handleCommand('zone_patrol')">地区巡检统计　　查看详情>></span>
            <div id="patrol_zone" style="height:90%"></div>
        </div>

        <div class="alarm_box_left row2-1">
            <p align="center">
                <span>全部企业</span>
                <span>{{risk_detail.pSum}}</span>
                <span>家</span>

            </p>
            <p align="center">
                <span>风险点数</span>
                <span>{{risk_detail.riskSum}}</span>
                <span>个</span>
                <span>重大风险</span>
                <span>{{risk_detail.oneGradeSum}}</span>
                <span>个</span>
            </p>
            <p align="center">
                <span>累计巡查</span>
                <span>{{risk_detail.eSum}}</span>
                <span>个</span>
                <span>隐患排查</span>
                <span>{{risk_detail.alarmSituationSum}}</span>
                <span>项</span>
            </p>
            <p align="center">
                <span>{{form.zone}}企业</span>
                <span>{{DetailData.length}}</span>
                <span>家</span>
            </p>
        </div>

        <div class="alarm_box_left_center row2-1">
            <span class="box-tit" @click="handleCommand('danger_count')" style="font-size: 14px;">风险点分布　　查看详情>></span>
            <div id="risk_point_chart" style="height:90%;"></div>
        </div>

        <div class="alarm_box_left_bottom row2-1">
            <span class="box-tit" @click="handleCommand('company_danger_count')"
                  style="font-size: 14px;">企业分布　　查看详情>></span>
            <div id="zone_pro" style="height:90%;"></div>
        </div>


    <el-dialog title="风险管控清单" :visible.sync="taskDataVisible">
        <el-table :data="taskData" :stripe="true" :border="true" size="mini" style="margin-bottom: 30px;">
            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
            <el-table-column prop="riskName" label="风险点名称" width="150"></el-table-column>
            <el-table-column prop="grade" label="风险等级" width="150">
                <template slot-scope="scope">
                    <div v-if="scope.row.grade==1">
                        <img src="../../../imgs/onelevel.png">
                    </div>
                    <div v-if="scope.row.grade==2">
                        <img src="../../../imgs/twolevel.png">
                    </div>
                    <div v-if="scope.row.grade==3">
                        <img src="../../../imgs/threelevel.png">
                    </div>
                    <div v-if="scope.row.grade==4">
                        <img src="../../../imgs/fourlevel.png">
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="name" label="巡检人员" width="150"></el-table-column>
            <el-table-column prop="cycle" label="巡检周期">
                <template slot-scope="scope">
                    <el-tag>每{{scope.row.cycle}}{{typeJson[scope.row.cycleType]}}一次</el-tag>
                </template>
            </el-table-column>
        </el-table>
        <div class="page-footer" style="margin-top: 20px">
            <el-pagination background layout="prev, pager, next" :pagesize="tpageSize" :total="ttotalCount"
                           :current-page.sync="tcurrentPage" @current-change="tonChangePage">
            </el-pagination>
        </div>
    </el-dialog>
    <el-dialog title="风险管控清单" :visible.sync="dlgAlarmVisible">
        <el-table :data="rtaskData" :stripe="true" :border="true" size="mini" style="margin-bottom: 30px;">
            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
            <el-table-column prop="riskName" label="风险点名称"></el-table-column>
            <el-table-column prop="grade" label="风险等级">
                <template slot-scope="scope">
                    <div v-if="scope.row.grade==1">
                        <img src="../../../imgs/onelevel.png">
                    </div>
                    <div v-if="scope.row.grade==2">
                        <img src="../../../imgs/twolevel.png">
                    </div>
                    <div v-if="scope.row.grade==3">
                        <img src="../../../imgs/threelevel.png">
                    </div>
                    <div v-if="scope.row.grade==4">
                        <img src="../../../imgs/fourlevel.png">
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="title" label="风险内容"></el-table-column>
            <el-table-column prop="reason" label="危害因素"></el-table-column>
            <el-table-column prop="damageType" label="可能导致的事故"></el-table-column>
            <el-table-column prop="scope" label="影响范围">
                <template slot-scope="scope">
                    <div v-if="scope.row.scope==0">
                        本厂
                    </div>
                    <div v-if="scope.row.scope==1">
                        作业场所
                    </div>
                    <div v-if="scope.row.scope==2">
                        设备
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="damage" label="潜在后果"></el-table-column>
        </el-table>
        <div class="page-footer" style="margin-top: 20px">
            <el-pagination background layout="prev, pager, next" :pagesize="rpageSize" :total="rtotalCount"
                           :current-page.sync="rcurrentPage" @current-change="ronChangePage">
            </el-pagination>
        </div>
    </el-dialog>
    <el-dialog title="告警明细" :visible.sync="alarmVisible" width="60%" style="margin-top:10px;height: 80%">
        <div style="height: 90%;width: 100%">
            <el-row>
                <el-col :span="24">
                    <div class="tit tit3" style="text-align: center">告警分组</div>
                    <div class="chart-outer" id="alarmChart2"></div>
                </el-col>
            </el-row>
        </div>
    </el-dialog>
    <el-dialog title="当日告警統計" :visible.sync="reportVisible" width="90%" style="display: none">

        <el-dialog
                width="70%"
                :title="pro_alram_name"
                :visible.sync="innerVisible"
                append-to-body>
            <p style="color: #409EFF">企业基本信息</p>
            <table width="100%" border="1" cellspacing="0" cellpadding="10">
                <tr align="center">
                    <td>企业名称</td>
                    <td>{{prodata.projectName}}</td>
                    <td>法人代表</td>
                    <td>{{prodata.legalMan}}</td>
                </tr>
                <tr align="center">
                    <td>负责人</td>
                    <td>{{prodata.manager}}</td>
                    <td>负责人电话</td>
                    <td>{{prodata.phone}}</td>
                </tr>
                <tr align="center">
                    <td>企业地址</td>
                    <td colspan="3">{{prodata.province}} {{prodata.city}} {{prodata.zone}} {{prodata.address}}</td>
                </tr>
            </table>
            <p style="color: #409EFF;margin-top: 10px">企业今日告警记录</p>
            <table border="1" cellspacing="0" cellpadding="5" width="100%">
                <thead>
                <th>企业名称</th>
                <th>告警描述</th>
                <th>发生时间</th>
                <th>告警级别</th>
                <th>处理状态</th>
                </thead>
                <tr align="center" v-for="(item,index) in day_Error_table" :key="index">
                    <td>{{item.ProjectName}}</td>
                    <td>{{item.ErrorName}}</td>
                    <td>{{item.LogTime.replace('T',' ')}}</td>
                    <td>{{item.errorGrade}}</td>
                    <td>{{item.ProcessFlag}}</td>
                </tr>
            </table>
            <el-pagination
                    @current-change="handleDayCurrentChange"
                    :current-page.sync="project_alarm_page.pageno"
                    :page-size="day_alarm_page.pagesize"
                    layout="total, prev, pager, next"
                    :total="day_alarm_page.totalCount">
            </el-pagination>

        </el-dialog>

        <h3 align="right">
            <el-button @click="printData" type="success">打印pdf</el-button>
        </h3>
        <div id="print">
            <el-row :gutter="22">
                <el-col :span="11" class="company">
                    <div class="tBT u-marginBottom7">
                              <span class="shuX">
                              </span>
                        <span class="tm">今日概况</span>
                    </div>
                    <div class="kaihu">
                        <div class=" nr">
                            <div class="box u-paddingTop32">
                                <p class="u-marginBottom0">
                                    <span class="dat">{{totalSum.projectCount}}</span>
                                    <span class="danwei">家</span>
                                </p>
                                <span>企业数量</span>
                            </div>
                            <div class="box u-paddingTop32">
                                <p class="u-marginBottom0">
                                    <span class="dat">{{totalSum.deviceCount}}</span>
                                    <span class="danwei">个</span>
                                </p>
                                <span>设备数量</span>
                            </div>
                            <div class="box u-paddingTop32">
                                <p class="u-marginBottom0">
                                    <span class="dat">{{totalSum.unprocess + totalSum.processed + totalSum.timeoutunprocess}}</span>
                                    <span class="danwei">个</span>
                                </p>
                                <span>告警总数</span>
                            </div>
                        </div>
                    </div>
                </el-col>
                <el-col :span="11">

                    <el-row>
                        <el-col :span="24">
                            <div class="tBT u-marginBottom7">
                              <span class="shuX">
                              </span>
                                <span class="tm">监测情况</span>
                            </div>
                            <el-row>
                                <el-col :span="22" class="todayWarning">
                                    <div class="nr" @click="warningPage()">
                                        <p>
                                            <span class="u-floatRight">今日</span>
                                        </p>
                                        <div class="flex">
                                            <div class="box">
                                                <p class="u-marginBottom0">
                                                    <span class="dat">{{totalSum.unprocess}}</span>
                                                    <span class="danwei">起</span>
                                                </p>
                                                <span>未处理</span>
                                            </div>
                                            <div class="box">
                                                <p class="u-marginBottom0">
                                                    <span class="dat">{{totalSum.timeoutunprocess}}</span>
                                                    <span class="danwei">个</span>
                                                </p>
                                                <span>超时未处理</span>
                                            </div>
                                        </div>
                                    </div>
                                </el-col>

                            </el-row>
                        </el-col>
                        <!--<el-col :span="14">-->


                        <!--<div class="tBT u-marginBottom7">-->
                        <!--<span class="shuX">-->
                        <!--</span>-->
                        <!--<span class="tm">执行情况</span>-->
                        <!--</div>-->
                        <!--<el-row>-->
                        <!--<el-col :span="11" class="todayProduce">-->
                        <!--<div class="nr" @click="producePage()">-->
                        <!--<p>-->
                        <!--<span class="u-floatRight">今日</span>-->
                        <!--</p>-->
                        <!--<div class="flex">-->
                        <!--<div class="box">-->
                        <!--<p class="u-marginBottom0">-->
                        <!--<span  style="font-size: 12px">某某建材企业</span>-->

                        <!--</p>-->
                        <!--<span>告警最多企业</span>-->
                        <!--</div>-->
                        <!--<div class="box">-->
                        <!--<p class="u-marginBottom0">-->
                        <!--<span style="font-size: 12px">某某水泥企业</span>-->

                        <!--</p>-->
                        <!--<span>处理率最低企业</span>-->
                        <!--</div>-->
                        <!--</div>-->
                        <!--</div>-->
                        <!--</el-col>-->
                        <!--<el-col :span="11" class="yesterdayProduce">-->
                        <!--<div class="nr" @click="producePage()">-->
                        <!--<p>-->
                        <!--<span class="u-floatRight">昨日</span>-->
                        <!--</p>-->
                        <!--<div class="flex">-->
                        <!--<div class="box">-->
                        <!--<p class="u-marginBottom0">-->
                        <!--<span  style="font-size: 12px">某某建材企业</span>-->

                        <!--</p>-->
                        <!--<span>告警最多企业</span>-->
                        <!--</div>-->
                        <!--<div class="box">-->
                        <!--<p class="u-marginBottom0">-->
                        <!--<span style="font-size: 12px">某某水泥企业</span>-->

                        <!--</p>-->
                        <!--<span>处理率最低企业</span>-->
                        <!--</div>-->
                        <!--</div>-->
                        <!--</div>-->
                        <!--</el-col>-->
                        <!--</el-row>-->
                        <!--</el-col>-->
                    </el-row>

                </el-col>
            </el-row>

            <el-divider content-position="left">今日告警类型分布</el-divider>
            <el-row>
                <el-col :span="12">

                    <table width="100%" border="1" cellspacing="0" cellpadding="10">
                        <thead>
                        <th>告警描述</th>
                        <th>告警次数</th>
                        </thead>

                        <tr align="center" v-for="(item,index) in alarmCount" :key="index">
                            <td>{{item.groupName}}</td>
                            <td>{{item.errorCount}}</td>
                        </tr>
                    </table>
                </el-col>
                <el-col :span="12">
                    <div class="chart-outer" id="alarm_Count">

                    </div>
                </el-col>
            </el-row>


            <el-divider content-position="left">今日企业告警处理情况</el-divider>
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item label="行业">
                    <el-select placeholder="请选择" v-model="project_alarm_page.catigory">
                        <el-option label="所有" value=""></el-option>
                        <el-option
                                v-for="item in businessArr"
                                :key="item.cid"
                                :label="item.cname"
                                :value="item.cid">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="区域">
                    <el-select v-model="project_alarm_page.zone" style="width:202px">
                        <el-option label="所有" value=""></el-option>
                        <el-option v-for="item in zoneArr" :label="item" :value="item">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="企业名称">
                    <el-input placeholder="请输入企业名称" v-model="project_alarm_page.projectName">
                        <el-button slot="append" icon="el-icon-search" @click="search_pro"></el-button>
                    </el-input>
                </el-form-item>
            </el-form>
            <table border="1" cellspacing="0" cellpadding="5" width="100%">
                <thead>
                <th>企业名称</th>
                <th>所在市</th>
                <th>所在区</th>
                <th>设备总数</th>
                <th>处理个数</th>
                <th>未处理数</th>
                <th>超时未处理数</th>
                <th>操作</th>
                </thead>
                <tr align="center" v-for="(item,index) in pro_alarm_table" :key="index">
                    <td>{{item.projectName}}</td>
                    <td>{{item.city}}</td>
                    <td>{{item.zone}}</td>
                    <td>{{item.deviceCount}}</td>
                    <td>{{item.unprocess}}</td>
                    <td>{{item.processed}}</td>
                    <td>{{item.timeoutunprocess}}</td>
                    <td>
                        <el-button type="primary" @click="pro_alarm_detail(index)">详情</el-button>
                    </td>
                </tr>
            </table>
            <el-pagination
                    @current-change="handleProCurrentChange"
                    :current-page.sync="project_alarm_page.pageno"
                    :page-size="project_alarm_page.pagesize"
                    layout="total, prev, pager, next"
                    :total="project_alarm_page.totalCount">
            </el-pagination>
        </div>

    </el-dialog>
    <el-dialog
            class="company_detail_dialog"
            style="display: none;font-size: 20px;"
            :title="sel_pro.projectName"
            :visible.sync="centerDialogVisible"
            :fullscreen="true"
            :close-on-click-modal="false"
            center>

        <el-dialog title="巡检明细" :visible.sync="detailFormVisible" append-to-body>
            <template v-if="patrolExecute">
                <p style="text-align: center">巡查基本信息</p>

                <table border="1" cellpadding="10" cellspacing="0" style="width: 100%;margin-top: 20px">
                    <tr>
                        <td style="font-weight: bold">风险点名称:</td>
                        <td>{{patrolExecute.riskName}}</td>
                        <td style="font-weight: bold">巡检人:</td>
                        <td>{{patrolExecute.userName}}</td>
                    </tr>
                    <tr>
                        <td style="font-weight: bold">巡检日期:</td>
                        <td>
                            <div v-if="patrolExecute.missionTime">
                                <el-tag size="medium">{{patrolExecute.missionTime.replace("T"," ")}}</el-tag>
                            </div>
                            <div v-else>
                                <el-tag size="medium">暂无数据</el-tag>
                            </div>
                        </td>
                        <td style="font-weight: bold">发现隐患数:</td>
                        <td>{{patrolExecute.patrolSum}}</td>
                    </tr>

                    <tr>
                        <td style="font-weight: bold">现场照片:</td>
                        <td colspan="3">
                            <template v-if="patrolExecute.img">
                                <a :href="patrolExecute.img" class="swipebox" title="ESC键退出">
                                    <el-popover
                                            placement="right"
                                            width="300"
                                            trigger="hover"
                                            popper-class="popClass">
                                        <img :src="patrolExecute.img"
                                             style="max-width:600px;max-height: 380px "/>
                                        <img :src="patrolExecute.img" slot="reference"
                                             style="max-width:80px;max-height: 80px "/>
                                    </el-popover>
                                </a>
                            </template>
                            <template v-if="patrolExecute.img1">
                                <a :href="patrolExecute.img1" class="swipebox" title="ESC键退出">
                                    <el-popover
                                            placement="right"
                                            width="300"
                                            trigger="hover"
                                            popper-class="popClass">
                                        <img :src="patrolExecute.img1"
                                             style="max-width:600px;max-height: 380px "/>
                                        <img :src="patrolExecute.img1" slot="reference"
                                             style="max-width:80px;max-height: 80px "/>
                                    </el-popover>
                                </a>
                            </template>
                            <template v-if="patrolExecute.img2">
                                <a :href="patrolExecute.img2" class="swipebox" title="ESC键退出">
                                    <el-popover
                                            placement="right"
                                            width="300"
                                            trigger="hover"
                                            popper-class="popClass">
                                        <img :src="patrolExecute.img2"
                                             style="max-width:600px;max-height: 380px "/>
                                        <img :src="patrolExecute.img2" slot="reference"
                                             style="max-width:80px;max-height: 80px "/>
                                    </el-popover>
                                </a>
                            </template>
                            <template v-if="patrolExecute.img3">
                                <a :href="patrolExecute.img3" class="swipebox" title="ESC键退出">
                                    <el-popover
                                            placement="right"
                                            width="300"
                                            trigger="hover"
                                            popper-class="popClass">
                                        <img :src="patrolExecute.img3"
                                             style="max-width:600px;max-height: 380px "/>
                                        <img :src="patrolExecute.img3" slot="reference"
                                             style="max-width:80px;max-height: 80px "/>
                                    </el-popover>
                                </a>
                            </template>

                        </td>
                    </tr>
                    <tr>
                        <td style="font-weight: bold">检查情况:</td>
                        <td colspan="2">
                            {{patrolExecute.missionDetail}}
                        <td>
                    </tr>
                </table>
            </template>

            <template v-if="executeDetails">
                <table border="1" cellpadding="10" cellspacing="0" style="width: 100%;margin-top: 20px">
                    <tr>
                        <td style="font-weight: bold">序号</td>
                        <td style="font-weight: bold">风险内容</td>
                        <td style="font-weight: bold">隐患等级</td>
                        <td style="font-weight: bold">隐患描述</td>
                        <td style="font-weight: bold">现场照片</td>
                    </tr>
                    <tr v-for="(item,index) in executeDetails">
                        <td>{{index+1}}</td>
                        <td>{{item.title}}</td>
                        <td>
                            <template v-if="item.processFlag !=null">
                                <div v-if="item.errorGrade==1" style="text-align: center;">
                                    <img src="../../../imgs/onelevel.png">
                                    <div align="center">极其危险</div>
                                </div>
                                <div v-if="item.errorGrade==2" style="text-align: center;">
                                    <img src="../../../imgs/twolevel.png">
                                    <div align="center">高度危险</div>
                                </div>
                                <div v-if="item.errorGrade==3" style="text-align: center;">
                                    <img src="../../../imgs/threelevel.png">
                                    <div align="center">显著危险</div>
                                </div>
                                <div v-if="item.errorGrade==4" style="text-align: center;">
                                    <img src="../../../imgs/fourlevel.png">
                                    <div align="center">稍有危险</div>
                                </div>
                            </template>
                            <template v-if="item.processFlag==null">
                                无隐患
                            </template>
                        </td>
                        <td>
                            <template v-if="item.processFlag==null">
                                无隐患
                            </template>
                            <template v-if="item.processFlag!=null">
                                {{item.errorDesc}}
                            </template>
                        </td>
                        <td>
                            <template v-if="item.image1">
                                <a :href="item.image1" class="swipebox" title="ESC键退出">
                                    <el-popover
                                            placement="right"
                                            width="300"
                                            trigger="hover"
                                            popper-class="popClass">
                                        <img :src="item.image1"
                                             style="max-width:600px;max-height: 380px "/>
                                        <img :src="item.image1" slot="reference"
                                             style="max-width:80px;max-height: 80px "/>
                                    </el-popover>
                                </a>
                            </template>
                        </td>
                    </tr>
                </table>
            </template>
        </el-dialog>


        <el-dialog title="风险区域详情" :visible.sync="zoneDetailVisible" append-to-body>

            <div class="text item">
                区域名称:{{zoneInfo.zone_name}}
            </div>
            <div class="text item">
                风险等级:{{zoneInfo.grade}}
            </div>
            <div class="text item">
                任务总数:{{zoneInfo.total}}
            </div>
            <div class="text item">
                任务完成数:{{zoneInfo.finished}}
            </div>
            <div class="text item">
                发现隐患数:{{zoneInfo.found }}
            </div>
            <div class="text item">
                已处理隐患数:{{zoneInfo.processed}}
            </div>
            <div class="text item">
                超期未处理数:{{zoneInfo.unprocessed_timeout}}
            </div>

        </el-dialog>


        <el-dialog title="明细" :visible.sync="pro_safe_visible" append-to-body width="90%">
            <iframe :src="page_url" style="height: 600px;" width="100%" frameborder="0"></iframe>
        </el-dialog>


        <el-dialog title="实时数据" :visible.sync="devVisible" width="90%" style="display: none"
                   :close-on-click-modal="false" append-to-body>

            <el-row>
                <el-col :span="10">
                    <div class="deviceInfo">
                        <ul class="attr">
                            <li>设备名称:　　{{device.DeviceName}}</li>
                            <li>设备编号:　　{{device.DeviceId}}</li>
                            <li>所属区域:　　{{device.zoneName}}</li>
                            <li>所属部门:　　{{device.DepartmentName}}</li>
                            <li>设备状态:　　<span v-if="device.online==1">在线</span><span
                                    v-else-if="device.online==0">离线</span></li>
                            <li>最近时间:　　{{device.updateTime}}</li>
                        </ul>
                    </div>

                </el-col>
                <el-col :span="14">
                    <div class="chart-outer" id="realChart">

                    </div>
                </el-col>
            </el-row>
            <div class="paramDiv">
                <el-row style="flex-wrap: nowrap">
                    <el-col :span="3" v-for="(item,index) in  paramData">
                        <div class="panel panel-f" @click="loadDeviceParam(index)">
                            <p>{{item.dp_name}}</p>
                            <h5>{{item.dp_value}}{{item.dp_unitid}}</h5>
                        </div>
                    </el-col>
                </el-row>
            </div>


        </el-dialog>

        <el-dialog title="历史数据" :visible.sync="hisVisible" width="90%" style="display: none"
                   :close-on-click-modal="false" append-to-body>

            <el-row>
                <div class="tag-group">
                    <span class="tag-group__title">历史数据</span>
                    <el-date-picker
                            v-model="day"
                            value-format="yyyy-MM-dd"
                            type="date"
                            placeholder="选择日期" style="width: 170px"
                            @change="dateChange">
                    </el-date-picker>
                    <el-tag
                            v-for="(item,index) in hisData.fields"
                            :key="item.title"
                            :type="paramIndex==index?'':'info'"
                            effect="dark"
                            @click="hisClick(index)"
                            style="cursor: pointer">
                        {{ item.title }}
                    </el-tag>
                </div>
                <el-col :span="24" style="margin-top: 10px">
                    <div id="hisChart" class="chart-outer">

                    </div>
                </el-col>
            </el-row>
        </el-dialog>

        <el-dialog title="回放列表" :visible.sync="video_HisVisible" width="90%" style="display: none"
                   :close-on-click-modal="false" :before-close="handleBackClose" append-to-body>

            <el-date-picker
                    v-model="video_time"
                    value-format="yyyy-MM-dd"
                    type="date"
                    placeholder="选择日期" style="width: 170px"
                    @change="video_back">
            </el-date-picker>
            </el-form-item>
            <el-table
                    :data="back_list"
                    height="400"
                    style="width: 100%">
                <el-table-column
                        prop="beginTime"
                        label="开始时间" align="center">
                </el-table-column>
                <el-table-column
                        prop="endTime"
                        label="结束时间"
                        align="center">
                </el-table-column>
                <el-table-column
                        label="播放" align="center">
                    <template slot-scope="scope">
                         <el-button type="primary" @click="video_back_play(scope.row)">播放</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>

        <el-dialog title="录像播放" :visible.sync="video_playVisible" :before-close="handleBackClose" width="90%"
                   style="display: none" :close-on-click-modal="false" append-to-body>
            <div id="backPlayer" style="height: 500px;width: 100%">

            </div>
        </el-dialog>


        <el-tabs type="card" v-model="activeName" @tab-click="handTabClick">
            <el-tab-pane name="danger_tab">
                <span slot="label"><i class="el-icon-message-solid"></i> 风险预警</span>
                <el-row style="color:#00c5cc">
                    <el-col :span="15" style="border: 1px solid #00c5cc ;height: 320px">
                        <el-row>
                            <el-col :span="12">
                                <div style="margin:30px">
                                    <p style="font-weight: 900"><b>| 昨日风险</b>
                                        <el-button type="primary" icon="el-icon-full-screen" size="mini" circle
                                                   @click="viewCode(prodata)"></el-button>
                                    </p>
                                    <!--<p style="height: 50px; width: 40%;background: #8dc63f;font-size: 30px;margin-left: 40%;font-weight: 900"-->
                                    <!--align="center"  v-if="company_today_kpi.fraction >=90">-->
                                    <!--低风险-->
                                    <!--</p>-->
                                    <p style="color:yellow; height: 50px; width: 40%;background: #8dc63f;font-size: 30px;margin-left: 40%;font-weight: 900"
                                       align="center" v-if="company_today_kpi.fraction >=75">
                                        一般风险
                                    </p>
                                    <p style="color:orange; height: 50px; width: 40%;background: #8dc63f;font-size: 30px;margin-left: 40%;font-weight: 900"
                                       align="center"
                                       v-if="company_today_kpi.fraction >=55 && company_today_kpi.fraction<75">
                                        较大风险
                                    </p>
                                    <p style="colro:red;height: 50px; width: 40%;background: #8dc63f;font-size: 30px;margin-left: 40%;font-weight: 900"
                                       align="center" v-if="company_today_kpi.fraction <55">
                                        重大风险
                                    </p>
                                    <div>
                                        <p>
                                            <span>巡检完成率:</span>
                                            <span>{{company_today_kpi.K1*100}}</span>
                                            <span>%</span>
                                        </p>
                                        <p>
                                            <span>告警处理率:</span>
                                            <span>{{company_today_kpi.K2*100}}</span>
                                            <span>%</span>
                                        </p>
                                        <p>
                                            <span>隐患整改率:</span>
                                            <span>{{company_today_kpi.K3*100}}</span>
                                            <span>%</span>
                                        </p>
                                        <p>
                                            <span>处理时效:</span>
                                            <span>{{company_today_kpi.K4*100}}</span>
                                            <span>%</span>
                                        </p>
                                        <p>
                                            <span>设备正常率:</span>
                                            <span>{{company_today_kpi.K5*100}}</span>
                                            <span>%</span>
                                        </p>
                                    </div>
                                </div>

                            </el-col>
                            <el-col :span="12">
                                <div style="margin:30px">
                                    <p style="font-weight: 900;">| 风险构成</p>
                                    <div id="danger_group" align="center"
                                         style="height: 250px;width: 80%;margin-left: 10%">

                                    </div>
                                </div>
                            </el-col>
                        </el-row>
                    </el-col>
                    <el-col :span="8" :offset="1" style="border: 1px solid #00c5cc ;color:#00c5cc;height: 320px">
                        <div style="margin:30px">
                            <p style="font-weight: 900;">| 发现&整改隐患</p>
                            <el-carousel :interval="3000" arrow="always" height="250px" v-if="wf_datas.length!=0"
                                         type="card">
                                <el-carousel-item v-for="item in wf_datas" :key="item">
                                    <el-card :body-style="{ padding: '0px' }">


                                        <el-popover
                                                placement="right"
                                                width="300"
                                                trigger="hover"
                                                popper-class="popClass">
                                            <img :src="item.image1" style="width: 100%;height: 500px">
                                            <img :src="item.image1" slot="reference"
                                                 style="width: 100%;height: 230px "/>
                                        </el-popover>


                                        <div style="padding: 0px 14px;">
                                            <span>{{item.wf_eventMsg}}</span>
                                            <div class="bottom clearfix">
                                                <time class="time">{{item.wf_tasktime.replace('T',' ')}}</time>
                                            </div>
                                        </div>
                                    </el-card>
                                </el-carousel-item>
                            </el-carousel>
                            <div style="color:white" v-if="wf_datas.length == 0">
                                無
                            </div>
                        </div>
                    </el-col>

                    <el-col :span="12" style="border: 1px solid #00c5cc ;height: 280px;margin-top: 30px">
                        <div style="margin:30px">
                            <p style="font-weight: 900"><b>| 安全趋势图</b></p>
                            <chart-bar v-bind:data="trend_option" style="height: 230px"></chart-bar>
                        </div>
                    </el-col>

                    <el-col :span="11" :offset="1"
                            style="border: 1px solid #00c5cc ;color:#00c5cc;height: 280px;margin-top: 30px">
                        <div style="margin:30px">
                            <p style="font-weight: 900"><b>| 风险要素趋势</b></p>

                            <chart-line v-bind:data="point_option" style="height: 230px"></chart-line>
                        </div>
                    </el-col>
                </el-row>

            </el-tab-pane>
            <el-tab-pane name="safe_tab"><span slot="label"><i class="el-icon-s-claim"></i>安全评估</span>
                <el-row style="color:#00c5cc">
                    <p align="center" style="font-size: 25px;font-weight: 700;">企业状态</p>
                    <div style="background-color: #00c5cc;height: 2px;margin:15px"></div>
                    <el-col :span="18">
                        <div style="margin: 0px 30px">
                            <p style="font-weight: 900">
                                <el-link type="primary" @click="handleDetail('risk_point')" target="_blank"><b>| 风险点位
                                    总共{{safe_count_data.riskLevel4 + safe_count_data.riskLevel3 +
                                    safe_count_data.riskLevel2 + safe_count_data.riskLevel1}}个</b>
                                </el-link>
                            </p>
                            <p>
                                <el-tag effect="dark">低风险Ⅳ级 {{safe_count_data.riskLevel4}}个</el-tag>
                                <el-tag color="#fbbd08" effect="dark">一般风险Ⅲ级 {{safe_count_data.riskLevel3}}个</el-tag>
                                <el-tag type="warning" effect="dark">较大风险Ⅱ级 {{safe_count_data.riskLevel2}}个</el-tag>
                                <el-tag type="danger" effect="dark">重大风险Ⅰ级 {{safe_count_data.riskLevel1}}个</el-tag>
                            </p>
                            <p style="">
                                <el-link type="primary" @click="handleDetail('dev_bill')" target="_blank"><b>| 设备设施
                                    总共{{safe_count_data.totalEqument}}个</b>
                                </el-link>
                            </p>

                            <p style="font-weight: 900">
                                <el-link type="primary" @click="handleDetail('risk_sources')" target="_blank"><b>| 危险源
                                    总共{{safe_count_data.risksourceLevel1 + safe_count_data.risksourceLevel2 +
                                    safe_count_data.risksourceLevel3 + safe_count_data.risksourceLevel4}}个</b>
                                </el-link>
                            </p>

                            <p>
                                <el-tag effect="dark">低风险Ⅳ级 {{safe_count_data.risksourceLevel4}}个</el-tag>
                                <el-tag color="#fbbd08" effect="dark">一般风险Ⅲ级 {{safe_count_data.risksourceLevel3}}个
                                </el-tag>
                                <el-tag type="warning" effect="dark">较大风险Ⅱ级 {{safe_count_data.risksourceLevel2}}个
                                </el-tag>
                                <el-tag type="danger" effect="dark">重大风险Ⅰ级 {{safe_count_data.risksourceLevel1}}个
                                </el-tag>
                            </p>
                            <p style="font-weight: 900">
                                <el-link type="primary" @click="handleDetail('fire_sources')" target="_blank"><b>| 消防资源
                                    总共{{safe_count_data.totalFiredevice}}个</b>
                                </el-link>
                            </p>
                            <p style="">
                                <el-link type="primary" @click="handleDetail('work_task')" target="_blank"><b>| 作业活动
                                    总共{{safe_count_data.totalWorkcontent}}个</b>
                                </el-link>
                            </p>
                        </div>
                    </el-col>
                    <el-col :span="6" style="border: 1px solid #00c5cc">
                        <i class="el-icon-warning" v-if="safe_count_data.riskGrade == 4"
                           style="font-size: 180px;margin-left: 25%;"></i>
                        <i class="el-icon-warning" v-if="safe_count_data.riskGrade == 3"
                           style="font-size: 180px;margin-left: 25%;color:yellow"></i>
                        <i class="el-icon-warning" v-if="safe_count_data.riskGrade == 2"
                           style="font-size: 180px;margin-left: 25%;color:orange"></i>
                        <i class="el-icon-warning" v-if="safe_count_data.riskGrade == 1"
                           style="font-size: 180px;margin-left: 25%;color: red"></i>
                        <i class="el-icon-warning" v-if="safe_count_data.riskGrade == 0"
                           style="font-size: 180px;margin-left: 25%"></i>
                        <p align="center" style="font-size: 40px;font-weight: 900"
                           v-if="safe_count_data.riskGrade == 4"> 低风险</p>
                        <p align="center" style="font-size: 40px;font-weight: 900;color:yellow"
                           v-if="safe_count_data.riskGrade == 3"> 一般风险</p>
                        <p align="center" style="font-size: 40px;font-weight: 900;color:orange"
                           v-if="safe_count_data.riskGrade == 2"> 较大风险</p>
                        <p align="center" style="font-size: 40px;font-weight: 900;color: red"
                           v-if="safe_count_data.riskGrade == 1"> 重大风险</p>
                        <p align="center" style="font-size: 40px;font-weight: 900"
                           v-if="safe_count_data.riskGrade == 0"> 未风险研判</p>
                    </el-col>


                    <el-col :span="24" style="border: 1px solid #00c5cc;margin-top: 20px">
                        <p align="center" style="font-size: 25px;font-weight: 700;">企业承诺</p>
                        <div style="background-color: #00c5cc;height: 2px;margin:15px"></div>
                        <p align="center">今天我司进行安全风险研判,各项安全风险防控措施已经落实到位，我承诺所有安全生产装置已处于安全运行状态、罐区、仓库等重大危险源安全风险得到了有效管控</p>
                        <p align="right">主要负责人:{{prodata.manager}}</p>
                        <p align="right">2020/03/18</p>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <el-tab-pane name="monitor_tab"><span slot="label"><i class="el-icon-s-marketing"></i>实时监测</span>


                <el-row v-for="(list,key,index) in dev_datas">
                    <p style="font-weight: 900;color:#00c5cc "><b>| {{deviceModel[key]}}</b></p>
                    <el-col :span="5" :offset="1" style="border: 1px solid #00c5cc ;margin-top: 5px"
                            v-for="(item,index) in list">
                        <table border="0" cellpadding="10" cellspacing="10">
                            <tr align="center">
                                <td rowspan="2">
                                    <template v-if="item.online == 0">
                                        <img :src="'../../../imgs/outline_'+key+'.png'"
                                             style="width: 120px;height: 120px"
                                             class=""/>
                                    </template>

                                    <template v-else-if="item.online == 1 && item.errorCount == 0 ">
                                        <img :src="'../../../imgs/noraml_'+key+'.png'"
                                             style="width: 120px;height: 120px"
                                             class=""/>
                                    </template>

                                    <template v-else-if="item.online == 1 && item.errorCount != 0 ">
                                        <img :src="'../../../imgs/warning_'+key+'.png'"
                                             style="width: 120px;height: 120px"
                                             class="anim-opacity2"/>
                                    </template>
                                </td>
                                <td align="right">
                                    <el-button type="warning" size="small" icon="el-icon-view" circle
                                               @click="dev_real(item.deviceId)"></el-button>
                                    <el-button type="info" size="small" icon="el-icon-c-scale-to-original" circle
                                               @click="dev_history(item.deviceId)"></el-button>
                                </td>
                            </tr>
                            <tr align="center">
                                <td>
                                    <template v-if="item.online == 0">
                                        <el-button type="info" size="small">离线</el-button>
                                    </template>

                                    <template v-else-if="item.online == 1 && item.errorCount == 0 ">
                                        <el-button type="success" size="small">在线</el-button>
                                    </template>

                                    <template v-else-if="item.online == 1 && item.errorCount != 0 ">
                                        <el-button type="warning" size="small">异常</el-button>
                                    </template>
                                </td>
                            </tr>
                            <tr align="center">
                                <td colspan="2">{{item.DeviceName}}</td>
                            </tr>
                        </table>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <el-tab-pane name="video_tab"><span slot="label"><i class="el-icon-video-camera-solid">视频监控</i></span>

                <el-row>
                    <el-col :span="4" style="border: 1px solid #00c5cc ;height: 500px ">
                        <el-menu class="" @select="handleSelect"
                                 style="background: transparent;height: 480px;overflow-y: scroll"
                                 text-color="#409EFF"
                                 active-text-color="#00c5cc">
                            <template v-if="videoData.length!=0">
                                <el-menu-item v-for="(item, index) in videoData" :index="index">
                                    <i class="el-icon-video-camera"></i>
                                    <span slot="title">{{item.CaptorName}}</span>

                                </el-menu-item>
                            </template>
                            <template v-if="videoData.length==0">
                                <p align="center">未安装摄像头</p>
                            </template>
                        </el-menu>
                    </el-col>
                    <el-col :span="16">
                        <div class="main-head">
                            <div id="myDivPlayer" style="height: 500px;width: 100%"></div>
                        </div>
                    </el-col>
                    <el-col :span="4" style="border: 1px solid #00c5cc ;height: 500px " v-if="videoData.length!=0">
                        <p align="center" style="margin-top: 40px">控制操作</p>


                        <div class="box">
                            <div class="bottom" style="margin-top:10px">
                                <el-button circle class="control_item" title="放大" @click="control_command('ZOOM_IN')"
                                           icon="el-icon-circle-plus"></el-button>
                            </div>
                            <div class="bottom" style="margin-top:10px">
                                <el-button circle class="control_item" title="向上" @click="control_command('up')"
                                           icon=" el-icon-arrow-up"></el-button>
                            </div>

                            <div class="bottom" style="margin-top:10px">

                                <el-button type="" circle class="control_item" title="向左"
                                           @click="control_command('left')" icon="el-icon-arrow-left"></el-button>

                                <el-button type="" @click="control_command('stop')" circle class="control_item"
                                           title="停止"
                                           icon="el-icon-video-pause"></el-button>


                                <el-button type="" circle class="control_item" title="向右"
                                           @click="control_command('right')" icon="el-icon-arrow-right"></el-button>

                            </div>

                            <div class="bottom" style="margin-top:10px">
                                <el-button circle class="control_item" @click="control_command('down')" title="向下"
                                           icon=" el-icon-arrow-down"></el-button>
                            </div>

                            <div class="bottom" style="margin-top:10px">
                                <el-button circle class="control_item" @click="control_command('ZOOM_OUT')" title="缩小"
                                           icon="el-icon-remove"></el-button>
                            </div>

                        </div>

                        <p align="center">
                            <el-button icon="el-icon-video-play" type="primary" round @click="video_back">录像回放
                            </el-button>
                        </p>

                    </el-col>
                </el-row>
            </el-tab-pane>
            <el-tab-pane name="basic_tab"><span slot="label"><i class="el-icon-s-order">基本信息</i></span>
                <table width="100%" border="1" cellspacing="0" cellpadding="30" style="color:#00c5cc;font-size: 20px"
                       bordercolor="#00c5cc">
                    <tr align="center">
                        <td>企业名称</td>
                        <td>{{prodata.projectName}}</td>
                        <td>社会信用代码</td>
                        <td>{{prodata.socialID}}</td>
                    </tr>
                    <tr align="center">
                        <td>法人代表</td>
                        <td>{{prodata.legalMan}}</td>
                        <td>法人电话</td>
                        <td>{{prodata.legalPhone}}</td>
                    </tr>
                    <tr align="center">
                        <td>负责人</td>
                        <td>{{prodata.manager}}</td>
                        <td>负责人电话</td>
                        <td>{{prodata.phone}}</td>
                    </tr>
                    <tr align="center">
                        <td>行政区域</td>
                        <td>{{prodata.zone}}</td>
                        <td>行业分类</td>
                        <td>{{prodata.cname}}</td>
                    </tr>
                    <tr align="center">
                        <td>企业地址</td>
                        <td colspan="3">{{prodata.province}} {{prodata.city}} {{prodata.zone}} {{prodata.address}}</td>
                    </tr>
                </table>
            </el-tab-pane>
             <el-tab-pane><span slot="label"><i class="el-icon-s-release"></i>事故信息</span>
                 <iframe :src="'../../prevention/safebill-manage/safehitch.html?projectNo='+sel_pro.projectNo"
                         style="height: 550px;" width="100%" frameborder="0"></iframe>
             </el-tab-pane>
            <el-tab-pane name="case_tab"><span slot="label"><i class="el-icon-s-marketing"></i>应急预案</span>
                <el-collapse accordion v-model="case_active">
                    <el-collapse-item title="应急预案管理" name="1">
                        <iframe :src="'../../prevention/contingency-manage/Preplan.html?projectNo='+sel_pro.projectNo"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>

                    <el-collapse-item title="应急考核管理" name="2">
                        <iframe :src="'../../prevention/contingency-manage/plan_exam.html?projectNo='+sel_pro.projectNo"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>
                    <el-collapse-item title="考核结果管理" name="3">
                        <iframe :src="'../../prevention/contingency-manage/exam_result.html?projectNo='+sel_pro.projectNo"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>

                    <el-collapse-item title="应急物资管理" name="4">
                        <iframe :src="'../../prevention/contingency-manage/EmergenceManage.html?projectNo='+sel_pro.projectNo"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>
                    <el-collapse-item title="应急物资配备" name="5">
                        <iframe :src="'../../prevention/contingency-manage/EmergenceEquipment.html?projectNo='+sel_pro.projectNo+'&id='+prodata.projectOwner"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>
                    <el-collapse-item title="应急演练" name="6">
                        <iframe :src="'../../prevention/contingency-manage/drillPlan.html?projectNo='+sel_pro.projectNo+'&id='+prodata.projectOwner"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
            <el-tab-pane name="safe_situation"><span slot="label"><i class="el-icon-map-location">应急资源</i></span>

                <el-row>
                    <el-col :span="20">
                        <div id="safe_map" style="height: 600px;width: 100%">

                        </div>
                    </el-col>
                    <el-col :span="4">
                        <div id="result_panel" style="overflow-y:scroll;height: 600px"></div>
                    </el-col>
                </el-row>
            </el-tab-pane>

            <el-tab-pane name="mapColor_tab"><span slot="label"><i class="el-icon-s-data">安全态势</i></span>
                <el-button type="primary" @click="showFourColorMap" class="four_map">
                    四色图
                </el-button>
                <div id="color_map" style="width: 100%;height: 600px"></div>
            </el-tab-pane>
            <el-tab-pane name="patrol_tab"><span slot="label"><i class="el-icon-place">巡查情况</i></span>
                <el-collapse v-model="patrol_active">
                    <!--<el-collapse-item title="今日巡查" name="1">-->

                    <!--<el-table :data="todayPatrolData" :stripe="true" :border="true" size="mini" height="280"-->
                    <!--style="width: 100%">-->
                    <!--<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>-->
                    <!--<el-table-column prop="patrolName" label="风险点名称" align="center"></el-table-column>-->
                    <!--<el-table-column prop="userName" label="巡检人员" align="center"></el-table-column>-->
                    <!--<el-table-column prop="cycle" label="周期" width="50" align="center"></el-table-column>-->
                    <!--<el-table-column prop="cycleType" label="周期类型" width="80" align="center">-->
                    <!--<template slot-scope="scope">-->
                    <!--<div v-if="scope.row.cycleType == '0'">-->
                    <!--分-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.cycleType == '1'">-->
                    <!--时-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.cycleType == '2'">-->
                    <!--天-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.cycleType == '3'">-->
                    <!--周-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.cycleType == '4'">-->
                    <!--月-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.cycleType == '5'">-->
                    <!--年-->
                    <!--</div>-->
                    <!--</template>-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="startTime" label="任务开始时间" align="center">-->
                    <!--<template slot-scope="scope">-->
                    <!--<el-tag size="medium">{{scope.row.createTime.replace("T"," ")}}</el-tag>-->
                    <!--</template>-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="missionTime" label="巡检时间" align="center">-->
                    <!--<template slot-scope="scope">-->
                    <!--<div v-if="scope.row.missionTime">-->
                    <!--<el-tag size="medium">{{scope.row.missionTime.replace("T"," ")}}</el-tag>-->
                    <!--</div>-->
                    <!--<div v-else>-->
                    <!--<el-tag size="medium">暂无数据</el-tag>-->
                    <!--</div>-->
                    <!--</template>-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="processflag" label="状态" align="center">-->
                    <!--<template slot-scope="scope">-->
                    <!--<div v-if="scope.row.processflag == '0'">-->
                    <!--<el-tag size="medium" type="warning">未巡检</el-tag>-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.processflag == '2'">-->
                    <!--<el-tag size="medium" type="success">已巡检</el-tag>-->
                    <!--</div>-->
                    <!--<div v-if="scope.row.processflag == '3'">-->
                    <!--<el-tag size="medium" type="warning">超时未巡检</el-tag>-->
                    <!--</div>-->
                    <!--</template>-->
                    <!--</el-table-column>-->

                    <!--</el-table>-->
                    <!--<el-pagination-->
                    <!--style="float: right"-->
                    <!--background-->
                    <!--layout="prev, pager, next"-->
                    <!--:pagesize="today_patrol_param.pagesize" :total="today_patrol_param.total"-->
                    <!--:current-page.sync="today_patrol_param.pageno" @current-change="today_patrol_Page">-->
                    <!--</el-pagination>-->
                    <!--</el-collapse-item>-->
                    <el-collapse-item title="巡查情况" name="2">
                        <el-form :inline="true" size="small" style="margin-top: 10px">
                            <el-form-item label="任务状态">
                                <el-select class="inputW" v-model="history_patrol_param.processflag">
                                    <el-option
                                            v-for="item in flagData"
                                            :key="item.Id"
                                            :label="item.Name"
                                            :value="item.Id">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="巡检时间">
                                <el-date-picker
                                        v-model="date"
                                        type="month"
                                        format="yyyy-MM"
                                        value-format="yyyy-MM"
                                >
                                </el-date-picker>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="his_search">查询</el-button>
                                <!--                            <el-button type="primary" @click="exportData">导出</el-button>-->
                            </el-form-item>
                        </el-form>

                        <el-table :data="hisPatrolData" :stripe="true" :border="true" size="mini"
                                  style="width: 100%;margin-bottom: 10px" height="350">
                            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
                            <el-table-column prop="riskName" label="风险点名称" align="center"></el-table-column>
                            <el-table-column prop="userName" label="巡检人员" align="center"></el-table-column>
                            <el-table-column prop="cycle" label="周期" width="50" align="center"></el-table-column>
                            <el-table-column prop="cycleType" label="周期类型" width="80" align="center">
                                <template slot-scope="scope">
                                    <div v-if="scope.row.cycleType == '0'">
                                        分
                                    </div>
                                    <div v-if="scope.row.cycleType == '1'">
                                        时
                                    </div>
                                    <div v-if="scope.row.cycleType == '2'">
                                        天
                                    </div>
                                    <div v-if="scope.row.cycleType == '3'">
                                        周
                                    </div>
                                    <div v-if="scope.row.cycleType == '4'">
                                        月
                                    </div>
                                    <div v-if="scope.row.cycleType == '5'">
                                        年
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column prop="startTime" label="任务开始时间" align="center">
                                <template slot-scope="scope">
                                    <el-tag size="medium">{{scope.row.createTime.replace("T"," ")}}</el-tag>
                                </template>
                            </el-table-column>
                            <el-table-column prop="missionTime" label="巡检时间">
                                <template slot-scope="scope">
                                    <div v-if="scope.row.missionTime">
                                        <el-tag size="medium">{{scope.row.missionTime.replace("T"," ")}}</el-tag>
                                    </div>
                                    <div v-else>
                                        <el-tag size="medium">暂无数据</el-tag>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column prop="processflag" label="状态" align="center">
                                <template slot-scope="scope">
                                    <div v-if="scope.row.processflag == '0'">
                                        <el-tag size="medium" type="warning">未巡检</el-tag>
                                    </div>
                                    <div v-if="scope.row.processflag == '2'">
                                        <el-tag size="medium" type="success">已巡检</el-tag>
                                    </div>
                                    <div v-if="scope.row.processflag == '3'">
                                        <el-tag size="medium" type="warning">超时未巡检</el-tag>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="现场图片" align="center">
                                <template slot-scope="scope">
                                    <template v-if="scope.row.img">

                                        <a :href="scope.row.img" class="swipebox" title="ESC键退出">
                                            <el-popover
                                                    placement="right"
                                                    width="300"
                                                    trigger="hover"
                                                    popper-class="popClass">
                                                <img :src="scope.row.img"
                                                     style="max-width:600px;max-height: 380px "/>
                                                <img :src="scope.row.img" slot="reference"
                                                     style="max-width:80px;max-height: 80px "/>
                                            </el-popover>
                                        </a>

                                    </template>
                                    <template v-if="scope.row.img1">
                                        <a :href="scope.row.img1" class="swipebox" title="ESC键退出">
                                            <el-popover
                                                    placement="right"
                                                    width="300"
                                                    trigger="hover"
                                                    popper-class="popClass">
                                                <img :src="scope.row.img1"
                                                     style="max-width:600px;max-height: 380px "/>
                                                <img :src="scope.row.img1" slot="reference"
                                                     style="max-width:80px;max-height: 80px "/>
                                            </el-popover>
                                        </a>
                                    </template>
                                    <template v-if="scope.row.img2">
                                        <a :href="scope.row.img2" class="swipebox" title="ESC键退出">
                                            <el-popover
                                                    placement="right"
                                                    width="300"
                                                    trigger="hover"
                                                    popper-class="popClass">
                                                <img :src="scope.row.img2"
                                                     style="max-width:600px;max-height: 380px "/>
                                                <img :src="scope.row.img2" slot="reference"
                                                     style="max-width:80px;max-height: 80px "/>
                                            </el-popover>
                                        </a>
                                    </template>
                                    <template v-if="scope.row.img3">
                                        <a :href="scope.row.img3" class="swipebox" title="ESC键退出">
                                            <el-popover
                                                    placement="right"
                                                    width="300"
                                                    trigger="hover"
                                                    popper-class="popClass">
                                                <img :src="scope.row.img3"
                                                     style="max-width:600px;max-height: 380px "/>
                                                <img :src="scope.row.img3" slot="reference"
                                                     style="max-width:80px;max-height: 80px "/>
                                            </el-popover>
                                        </a>
                                    </template>
                                </template>
                            </el-table-column>
                            <el-table-column label="是否有隐患" align="center">
                                <template slot-scope="scope">
                                    <div v-if="scope.row.alarmSituation==1">
                                        <el-tag size="medium" type="danger">存在隐患</el-tag>
                                    </div>
                                    <div v-if="scope.row.alarmSituation==0">
                                        <el-tag size="medium" type="success">无隐患</el-tag>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" width="300px" align="center">
                                <template slot-scope="scope">
                                    <el-button @click="showPatrolDetail(scope.row.Id,scope.row.processflag)" round
                                               size="mini"
                                               icon="el-icon-share">详情
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                        <el-pagination
                                style="float: right"
                                background
                                layout="prev, pager, next"
                                :pagesize="history_patrol_param.pagesize" :total="history_patrol_param.total"
                                :current-page.sync="history_patrol_param.pageno" @current-change="history_patrol_Page">
                        </el-pagination>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
            <el-tab-pane name="hidden_danger_tab"><span slot="label"><i class="el-icon-data-line">隐患工单</i></span>
                <iframe :src="'warningbill_all.html?projectNo='+sel_pro.projectNo" style="height: 650px;" width="100%"
                        frameborder="0"></iframe>
            </el-tab-pane>
            <el-tab-pane name="alarm_tab"><span slot="label"><i class="el-icon-s-opportunity">告警情况</i></span>
                <el-form :inline="true" label-width="155px" style="margin-top: 15px">
                    <el-form-item>
                        <el-date-picker
                                v-model="company_alarm_param.date"
                                type="daterange"
                                range-separator="至"
                                start-placeholder="开始日期"
                                end-placeholder="结束日期">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="alarm_search">查询</el-button>
                    </el-form-item>
                </el-form>
                <table border="1" cellspacing="0" cellpadding="5" width="100%">
                    <thead>
                    <th>告警区域</th>
                    <th>告警描述</th>
                    <th>联系人</th>
                    <th>电话</th>
                    <th>发生时间</th>
                    <th>告警级别</th>
                    <th>处理状态</th>
                    </thead>
                    <tr align="center" v-for="(item,index) in company_alarm_table" :key="index">
                        <td>{{item.ProjectName}}</td>
                        <td>{{item.ErrorName}}</td>
                        <td>{{item.manager}}</td>
                        <td>{{item.phone}}</td>
                        <td>{{item.LogTime.replace('T',' ')}}</td>
                        <td>{{item.errorGrade}}</td>
                        <td>
                            <template v-if="item.ProcessFlag == 0">
                                <el-tag type="info">未处理</el-tag>
                            </template>

                            <template v-else>
                                <el-tag type="info">已确认</el-tag>
                            </template>
                        </td>
                    </tr>
                </table>
                <el-pagination
                        @current-change="handleCompanyAlarmChange"
                        :current-page.sync="company_alarm_param.pageno"
                        :page-size="company_alarm_param.pagesize"
                        layout="total, prev, pager, next"
                        :total="company_alarm_param.total"
                        style="float: right">
                </el-pagination>
            </el-tab-pane>


            <el-tab-pane name="train_tab"><span slot="label"><i class="el-icon-s-marketing"></i>风险培训</span>
                <el-collapse accordion v-model="train_active">
                    <el-collapse-item title="培训计划" name="1">
                        <iframe :src="'../../prevention/risk-train/trainplan.html?projectNo='+sel_pro.projectNo"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>

                    <el-collapse-item title="培训资料" name="2">
                        <iframe :src="'../../prevention/risk-train/trainword.html?projectNo='+sel_pro.projectNo"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>

            <el-tab-pane name="personnel_tab"><span slot="label"><i class="el-icon-s-marketing"></i>企业员工管理</span>
                <el-collapse accordion v-model="personnel_active">
                    <el-collapse-item title="企业员工管理" name="1">
                        <iframe :src="'../../prevention/personnel-manage/employees.html?projectNo='+sel_pro.projectNo+'&id='+prodata.projectOwner"
                                style="height: 450px;" width="100%" frameborder="0"></iframe>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
        </el-tabs>
    </el-dialog>
    <el-dialog
            style="display: none;font-size: 20px;"
            :title="sel_pro.projectName"
            :visible.sync="contingencyVisible"
            width="90%"
            :close-on-click-modal="false"

            center>

        <el-dialog
                width="70%"
                :title="sel_pro.projectName"
                :visible.sync="chemicalsVisible"
                :close-on-click-modal="false"
                center
                append-to-body>
            <el-collapse accordion>
                <el-collapse-item title="化学品信息" name="1">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 20px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td>化学品中文名：</td>
                            <td>硝化纤维素</td>
                            <td>其他中文名：</td>
                            <td>硝化棉；硝基纤维素</td>
                        </tr>
                        <tr align="center">
                            <td>化学品英文名称：</td>
                            <td>nitrocellulose</td>
                            <td>CAS号：</td>
                            <td>9004-70-0</td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="成分组成部分" name="2">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 16px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td>纯品/混合物：</td>
                            <td>纯品</td>
                            <td>有害物成份：</td>
                            <td>硝化棉</td>
                        </tr>
                        <tr align="center">
                            <td>浓度：</td>
                            <td></td>
                            <td>CAS No：</td>
                            <td>9004-70-0</td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="危险性概述" name="3">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 16px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td>危险性类别：</td>
                            <td>易燃固体</td>
                            <td>侵入途径：</td>
                            <td>吸入</td>
                        </tr>
                        <tr align="center">
                            <td>健康危害：</td>
                            <td>硝化棉本身对健康无害</td>
                            <td>环境危害：</td>
                            <td>对环境有害</td>
                        </tr>
                        <tr align="center">
                            <td>燃爆危险：</td>
                            <td colspan="3">易燃、受撞击、磨擦，遇明火或其他我点火源极易爆炸</td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="急救措施" name="4">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 16px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td>皮肤接触：</td>
                            <td>脱去污染的衣着，用流动的清水冲洗，如有不适感，就医</td>
                            <td>眼睛接触：</td>
                            <td>提起眼睑，用流动清水或生理盐水冲洗，如有不适感，就医</td>
                        </tr>
                        <tr align="center">
                            <td>吸入：</td>
                            <td>脱离现场至空气新鲜处。如有不适感，就医</td>
                            <td>食入：</td>
                            <td>饮足量温水。催吐。就医</td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="消防措施" name="5">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 16px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td>危险特性：</td>
                            <td>暴露在空气中能自燃。本品遇到火星、高温、氧化剂以及大多数有机胺（对苯二甲胺等）会发生燃烧和爆炸。E34</td>
                            <td>有害燃烧产物：</td>
                            <td>提一氧化碳、氢氧化物</td>
                        </tr>
                        <tr align="center">
                            <td>灭火方法：</td>
                            <td>用水、雾状水、泡沫、干粉、二氧化碳灭火</td>
                            <td>灭火注意事项及措施：</td>
                            <td>消防人员须戴好防毒面具、在阿全距离以外，在上风向灭火。消防人员须在有防爆掩蔽出操作。禁止用砂土压盖</td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="泄露应急处理" name="6">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 16px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td colspan="2">应急行动：</td>
                            <td colspan="3">清除所有点火源。隔离泄露污染区，限制出入。建议应急处理人员带防尘口罩，穿消防防护服。作业时使用的所有设备应接地。
                                禁止接触或跨越泄露物。小量泄露：用大量水冲洗。洗水稀释后放入废水系统。大量泄露：用水润湿，并筑堤收容。通过慢慢加入大量水保持泄漏物湿润
                            </td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="操作处置与储存" name="7">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10"
                           style="font-size: 16px;padding-top: 25px;" bordercolor="#0081ff">
                        <tr align="center">
                            <td colspan="2">操作注意事项：</td>
                            <td colspan="3">
                                密闭操作。局部排风。操作人员必须经过专门培训，严格遵守操作规程。建议操作人员佩戴自吸过滤式防尘口罩。穿防静电工作服。远离火种、热源，工作场所禁止吸烟。使用防爆型的通风系统和设备。
                                避免产生粉尘。避免与氧化剂接触。搬运时要轻装轻卸。防止包装及容器损坏。禁止震动、撞击和摩擦
                            </td>
                        </tr>
                        <tr align="center">
                            <td colspan="2">储存注意事项：</td>
                            <td colspan="3">储存于阴凉、通风的库房。远离火种、热源。库温不宜超过35℃</td>
                        </tr>
                    </table>
                </el-collapse-item>
            </el-collapse>

        </el-dialog>

        <el-row style="height: 650px">
            <el-collapse accordion>
                <el-collapse-item title="企业信息" name="1">
                    <el-tabs type="card">
                        <el-tab-pane label="企业信息">
                            <table width="100%" border="1" cellspacing="0" cellpadding="20"
                                   style="color:black;font-size: 20px" bordercolor="#0081ff">
                                <tr align="center">
                                    <td>企业名称</td>
                                    <td>{{prodata.projectName}}</td>
                                    <td>社会信用代码</td>
                                    <td>{{prodata.socialID}}</td>
                                </tr>
                                <tr align="center">
                                    <td>法人代表</td>
                                    <td>{{prodata.legalMan}}</td>
                                    <td>法人电话</td>
                                    <td>{{prodata.legalPhone}}</td>
                                </tr>
                                <tr align="center">
                                    <td>负责人</td>
                                    <td>{{prodata.manager}}</td>
                                    <td>负责人电话</td>
                                    <td>{{prodata.phone}}</td>
                                </tr>
                                <tr align="center">
                                    <td>行政区域</td>
                                    <td>{{prodata.zone}}</td>
                                    <td>行业分类</td>
                                    <td>{{prodata.cname}}</td>
                                </tr>
                                <tr align="center">
                                    <td>企业地址</td>
                                    <td colspan="3">{{prodata.province}} {{prodata.city}} {{prodata.zone}}
                                        {{prodata.address}}
                                    </td>
                                </tr>
                            </table>
                        </el-tab-pane>
                        <el-tab-pane label="化学品信息">
                            <table width="100%" border="1" cellspacing="0" cellpadding="20"
                                   style="color:black;font-size: 20px" bordercolor="#0081ff">
                                <tr align="center">
                                    <td>化学品名称</td>
                                    <td>硝化纤维素</td>
                                    <td>中文名称</td>
                                    <td>硝化棉；硝基纤维素</td>
                                </tr>
                                <tr align="center">
                                    <td>化学品名称</td>
                                    <td>硝化纤维素</td>
                                    <td>中文名称</td>
                                    <td>硝化棉；硝基纤维素</td>
                                </tr>
                                <tr align="center">
                                    <td>化学品名称</td>
                                    <td>硝化纤维素</td>
                                    <td>中文名称</td>
                                    <td>硝化棉；硝基纤维素</td>
                                </tr>
                                <tr align="center">
                                    <td>化学品名称</td>
                                    <td>硝化纤维素</td>
                                    <td>中文名称</td>
                                    <td>硝化棉；硝基纤维素</td>
                                </tr>
                            </table>
                        </el-tab-pane>
                        <el-tab-pane label="危险源信息">
                            <table width="100%" border="1" cellspacing="0" cellpadding="5"
                                   style="color:black;font-size: 20px" bordercolor="#0081ff">
                                <tr align="center" style="background: darkblue;color:white">
                                    <td>危险源名称</td>
                                    <td>作业区域</td>
                                    <td>可能造成后果</td>
                                    <td>控制措施</td>
                                    <td>周围环境</td>
                                </tr>
                                <tr align="center" v-for="(item,index) in dangerous_data" :key="index">
                                    <td>{{item.riskName}}</td>
                                    <td>{{item.workArea}}</td>
                                    <td>{{item.possibleResult}}</td>
                                    <td>{{item.controlMeasure}}</td>
                                    <td>{{item.surrounding}}</td>
                                </tr>
                            </table>
                        </el-tab-pane>
                        <el-tab-pane label="重点化工工艺信息">
                            <table width="100%" border="1" cellspacing="0" cellpadding="20"
                                   style="color:black;font-size: 20px" bordercolor="#0081ff">
                                <tr align="center" style="background: darkblue;color:white">
                                    <td>化工工艺名称</td>
                                    <td>工艺负责人</td>
                                </tr>
                                <tr align="center">
                                    <td>油罐区</td>
                                    <td>张立三</td>
                                </tr>

                            </table>
                        </el-tab-pane>
                    </el-tabs>
                </el-collapse-item>
                <el-collapse-item title="爆炸物质信息" name="2">
                    <table width="100%" border="1" cellspacing="0" cellpadding="10" style="font-size: 20px"
                           bordercolor="#0081ff">
                        <tr align="center" style="color:#00c5cc;">
                            <td>序号</td>
                            <td>化学品名称</td>
                            <td>其他中文名</td>
                            <td>化学品英文名</td>
                            <td>CAS号</td>
                            <td>储量</td>
                            <td>查看</td>
                        </tr>
                        <tr align="center">
                            <td>1</td>
                            <td>硝化纤维素</td>
                            <td>硝化棉；硝基纤维素</td>
                            <td>nitrocellulose</td>
                            <td>9004-70-0</td>
                            <td>0.5吨</td>
                            <td>
                                <el-button icon="el-icon-search" circle @click="chemicals_detail"></el-button>
                            </td>
                        </tr>
                    </table>
                </el-collapse-item>
                <el-collapse-item title="历史事故信息" name="3">
                    <iframe :src="'../../prevention/safebill-manage/safehitch.html?projectNo='+sel_pro.projectNo"
                            style="height: 450px;" width="100%" frameborder="0"></iframe>
                </el-collapse-item>

            </el-collapse>
        </el-row>

    </el-dialog>
    <el-dialog
            title="二维码图片"
            :visible.sync="qrcodeVisible"
            width="300"
            style="width:50%"
    >
        <div id="qrcodeImg"></div>
    </el-dialog>
    <el-dialog title="四色图" :visible.sync="four_color_visible" width="70%" style="display: none">

        <el-carousel :interval="4000" type="card" height="400px">
            <el-carousel-item v-for="(item,index) in color_pics" :key="item">
                <el-image
                        :src="item.ImageName"
                        fit="cover"
                        :preview-src-list="[item.ImageName]">

                    <div slot="error" class="image-slot">
                        <i class="el-icon-picture-outline"></i>
                    </div>
                </el-image>
            </el-carousel-item>
        </el-carousel>

    </el-dialog>
    <el-dialog title="区域巡检统计" style="display: none;" :visible.sync="zone_partrol_visible" width="90%">
        <table width="100%" border="1" cellspacing="0" cellpadding="10"
               style="font-size: 14px;color:white;font-weight: 900" bordercolor="#0081ff">
            <tr align="center" style="background: darkblue">
                <th>行政区域</th>
                <th>任务总数</th>
                <th>任务完成数</th>
                <th>任务未完成数</th>
                <th>任务超时数</th>
                <th>任务完成率</th>
            </tr>
            <tr align="center" v-for="(item,index) in zone_patrol" :key="index">
                <td>{{item.zone}}</td>
                <td>{{item.total}}</td>
                <td>{{item.finished}}</td>
                <td>{{item.finish}}</td>
                <td>{{item.finish_timeout}}</td>
                <td>{{item.finishedrate}}</td>
            </tr>
        </table>
    </el-dialog>
    <el-dialog style="display: none;" class="company_asset" :visible.sync="company_visible" width="90%">

        <el-row>
            <el-col :span="5" :offset="1" style="background: #F56C6C;border-radius: 8px;color:white">
                <p align="center">高风险 (Ⅰ级)</p>
                <p align="center"
                   style="background: #d73530;    margin: 4% 40%; border-radius: 10px;line-height: 40px;">
                    {{company_danger_count.ones}}</p>
            </el-col>
            <el-col :span="5" :offset="1" style="background: #E6A23C;border-radius: 8px;color:white">
                <p align="center">较大风险(Ⅱ级)</p>
                <p align="center"
                   style="background: #9D4F00;    margin: 4% 40%; border-radius: 10px;line-height: 40px;">
                    {{company_danger_count.twos}}</p>
            </el-col>
            <el-col :span="5" :offset="1" style="background: #fbbd08;border-radius: 8px;color:white">
                <p align="center">一般风险(Ⅲ级)</p>
                <p align="center"
                   style="background: #f37b1d;    margin: 4% 40%; border-radius: 10px;line-height: 40px;">
                    {{company_danger_count.threes}}</p>
            </el-col>
            <el-col :span="5" :offset="1" style="background: #0081ff;border-radius: 8px;color:white">
                <p align="center">低风险(Ⅳ级)</p>
                <p align="center"
                   style="background: #6739b6;    margin: 4% 40%; border-radius: 10px;line-height: 40px;">
                    {{company_danger_count.fours}}</p>
            </el-col>
        </el-row>
        <el-form :inline="true" label-width="150px" style="margin-top: 15px">
            <el-form-item label="企业名称">
                <el-input placeholder="企业名称" v-model="assess_param.projectName" style="width: 150px;"></el-input>
            </el-form-item>
            <el-form-item label="风险等级">
                <el-select style="width: 150px;" v-model="assess_param.riskGrade">
                    <el-option label="全部" value=""></el-option>
                    <el-option label="Ⅰ级" value="1"></el-option>
                    <el-option label="Ⅱ级" value="2"></el-option>
                    <el-option label="Ⅲ级" value="3"></el-option>
                    <el-option label="Ⅳ级" value="4"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-date-picker
                        v-model="assess_param.date"
                        value-format="yyyy-MM"
                        type="month"
                        placeholder="选择日期" style="width: 170px">
                </el-date-picker>
            </el-form-item>
            <el-form-item label="区:">
                <el-select v-model="assess_param.zone">
                    <el-option v-for="item in zoneArr" :label="item" :value="item">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="companyAssessSearch">查询</el-button>
            </el-form-item>
        </el-form>
        <el-row>
            <el-table
                    :data="company_assess_data"
                    height="400"
                    :row-class-name="tableRowClassName"
                    :header-cell-class-name="tableHeaderClass"
                    style="width: 100%">
                <el-table-column
                        type="index"
                        label="序号"
                        align="center"
                        width="100"
                >
                </el-table-column>
                <el-table-column
                        prop="projectName"
                        label="企业名称"
                        align="center">
                    <template slot-scope="scope">
                        <el-tag type="success" effect="dark">{{scope.row.projectName}}</el-tag>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="name"
                        label="风险等级"
                        align="center">
                    <template slot-scope="scope">
                        <template v-if="scope.row.riskGrade == 4">
                            <el-tag type="">Ⅳ级</el-tag>
                        </template>
                        <template v-if="scope.row.riskGrade == 2">
                            <el-tag style="color: #E6A23C;">二级</el-tag>
                        </template>
                        <template v-if="scope.row.riskGrade == 3">
                            <el-tag type="warning">三级</el-tag>
                        </template>
                        <template v-if="scope.row.riskGrade == 1">
                            <el-tag type="danger">一级</el-tag>
                        </template>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="fraction"
                        label="评分"
                        align="center">
                </el-table-column>
                <el-table-column
                        prop="city"
                        label="市"
                        align="center">
                </el-table-column>
                <el-table-column
                        prop="zone"
                        label="区"
                        align="center">
                </el-table-column>
                <el-table-column
                        prop="K1"
                        label="巡检完成率"
                        align="center">
                    <template slot-scope="scope">
                        {{scope.row.K1*100}}%
                    </template>
                </el-table-column>
                <el-table-column
                        prop="K2"
                        label="告警处理率"
                        align="center">
                    <template slot-scope="scope">
                        {{scope.row.K2*100}}%
                    </template>
                </el-table-column>
                <el-table-column
                        prop="K3"
                        label="隐患整改率"
                        align="center">
                    <template slot-scope="scope">
                        {{scope.row.K3*100}}%
                    </template>
                </el-table-column>
                <el-table-column
                        prop="K4"
                        label="处理时效"
                        align="center">
                    <template slot-scope="scope">
                        {{scope.row.K4*100}}%
                    </template>
                </el-table-column>
                <el-table-column
                        prop="K5"
                        label="设备正常率"
                        align="center">
                    <template slot-scope="scope">
                        {{scope.row.K5*100}}%
                    </template>
                </el-table-column>
                <el-table-column
                        label="查看报告"
                        align="center" width="200">
                    <template slot-scope="scope">
                        <el-button type="primary" icon="el-icon-document-remove"
                                   @click="viewReport(scope.row)" id="viewReport"></el-button>
                        <el-button type="primary" icon="el-icon-full-screen" @click="viewCode(scope.row)"></el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                    style="float: right"
                    background
                    layout="prev, pager, next"
                    :pagesize="assess_param.pagesize" :total="assess_param.total"
                    :current-page.sync="assess_param.pageno" @current-change="onAssessChangePage">
            </el-pagination>
        </el-row>
    </el-dialog>
    <iframe id="printf" src="" width="0" height="0" frameborder="0"></iframe>
    <div id="audioDiv" style="height:30px;width:30px;display: none"></div>
    <el-dialog
            style="display: none;font-size: 20px;"
            :visible.sync="iframeVisible"
            fullscreen="true"
            :close-on-click-modal="false"
            center>
        <iframe :src="page_url" style="height: 700px;" width="100%" id="ifrDialog" frameborder="0"></iframe>
    </el-dialog>
</div>

<script src="https://open.ys7.com/sdk/js/1.3/ezuikit.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=GSkyZRDlTKcIqzerwITZvxee"></script>
<!--加载鼠标绘制工具-->
<script type="text/javascript" src="../../../js/liveplayer-element.min.js"></script>
<script type='text/javascript' src='../../../assets/bundle.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/jquery-1.11.2.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/echarts.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/common.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/component.js' charset='utf-8'></script>
<script type="text/javascript" src="../user-visual/js/scroll.js"></script>
<script type='text/javascript' src='../../../assets/jquery.swipebox.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/jquery.qrcode.min.js' charset='utf-8'></script>
<script>
    $(function ($) {
        $(".swipebox").swipebox();
    })

    function viewReport1(row) {
        vuePage.sel_pro.projectNo = row.projectNo;
        vuePage.sel_pro.projectName = row.projectName;
        vuePage.showProDetail(row.projectNo);
    }

    let mapLoading = null;
    let vuePage = new Vue({
            el: '#page-monitor',
            data: {
                patrol_active: '2',
                train_active: '1',
                personnel_active: '1',
                case_active: '1',
                color_pics: [],
                risk_detail: '',
                DetailData: [],
                qrcodeVisible: false,
                four_color_visible: false,
                zone_partrol_visible: false,
                zone_patrol: [],
                project_alarm_page: {
                    pageno: 1,
                    pagesize: 10,
                    totalCount: 10,
                    projectName: '',
                    catigory: '',
                    zone: ''
                },
                day_alarm_page: {
                    pageno: 1,
                    pagesize: 10,
                    totalCount: 10,
                    projectNo: '',
                    beginTime: '',
                },
                devVisible: false,
                hisVisible: false,
                company_visible: false,
                assess_param: {
                    pagesize: 10,
                    pageno: 1,
                    total: 10,
                    projectName: '',
                    date: '',
                    riskGrade: '',
                },
                wf_datas: [],
                company_assess_data: [],
                zoneDetailVisible: false,
                activeName: 'danger_tab',
                trend_option: {},
                point_option: {},
                businessArr: [],
                day_Error_table: [],
                prodata: {},
                pro_alram_name: '',
                innerVisible: false,
                pro_alarm_table: [],
                company_alarm_table: [],
                alarmCount: [],
                chartOptionAlarm: {},
                totalSum: {},
                todayCase: {},
                todayAlarm: {},
                yesterdayAlarm: {},
                yesterdayCase: {},
                reportVisible: false,
                alarmVisible: false,
                tableAlarm: [],
                tableData: [],
                provinceArr: [],
                cityArr: [],
                zoneArr: [],
                form: {
                    projectName: '',
                    country: '中国',
                    province: '',
                    city: '',
                    zone: '',
                },
                height: 500,
                overlays: [], //marker 数组
                map: null, //地图
                safe_map: null, // 态势地图
                centerDialogVisible: false,
                taskDataVisible: false,
                searchForm: {},
                zoneList: {},
                selMarker: {}, //选择marker
                dataJson: {}, //存数据
                labelJson: {}, //存标签
                detailVisible: false,
                dlgAlarmVisible: false,
                equipmentType: ['用电', '用水', '烟感', '手提式灭火器', '摄像头', '其他'],
                iconType: ['el_', 'water_', 'smoke_', 'handleFire', 'video', 'other'],
                device: '',
                paramData: '',
                sel_pro: {},
                param: {
                    pagesize: 50,
                    pageno: 1,
                    total: 10,
                },
                line_List: [],
                flag: true,
                time1: null,
                errorList: [],
                taskData: [],
                tpageSize: 10,
                ttotalCount: 0,
                tcurrentPage: 1,
                checkprojectNo: '',
                typeJson: {
                    0: '分',
                    1: '时',
                    2: '天',
                    3: '周',
                    4: '月',
                    5: '年',
                },
                deviceModel: {
                    200: '三相智慧用电',
                    880: '防入侵检测',
                },
                dev_datas: '',
                dlgAlarmVisible: false,
                rtaskData: [],
                rcheckprojectNo: '',
                rpageSize: 10,
                rtotalCount: 0,
                rcurrentPage: 1,
                centerDialogVisible: false, // 企业明细
                contingencyVisible: false,  // 应急
                chemicalsVisible: false,   // 化学品明细
                iframeVisible: false,  // 其他页面
                videoData: [],
                sel_video: {},
                lastOptions: '',
                lastpresetIndex: 0,
                page_url: '../../404/index.html',
                dangerous_data: [], //危险源信息
                driving: '',//路线规划
                flagData: [{Name: '所有', Id: -1}, {Name: '已巡检', Id: 2}, {Name: '超时未巡检', Id: 3}],
                today_patrol_param: {
                    pagesize: 10,
                    pageno: 1,
                    projectNo: '',
                    total: 5,
                    processflag: 0
                },
                history_patrol_param: {
                    pagesize: 10,
                    pageno: 1,
                    projectNo: '',
                    total: 5,
                    startTime: '',
                    endTime: '',
                    processflag: '',
                },
                imageUrl: '',
                todayPatrolData: [],
                hisPatrolData: [],
                detailFormVisible: false,
                pro_safe_visible: false,
                patrolExecute: {},
                executeDetails: '',
                company_alarm_param: {
                    date: [],
                    pagesize: 5,
                    pageno: 1,
                    projectNo: '',
                    total: 5,
                },
                zoneInfo: "",
                paramData: '',
                device: '',
                index: 0,
                paramIndex: 0,
                elOptions: {},
                day: '',
                hisData: {},
                safe_count_data: {},
                safe_map: null,
                driving_Point: {},
                company_danger_count: '',
                company_today_kpi: '',
                date: '',
                pro_totalCount: 0,
                video_time: TimeUtil.convertToString(new Date()).substr(0, 10),
                video_HisVisible: false,
                video_back_list: [],
                video_playVisible: false,
                back_list:[],
                back_url:[],
            },
            created: function () {

                this.date = TimeUtil.convertToString(new Date()).substr(0, 7);
                // HttpUtil.get('Zone/Child', {parentName: '中国', level: 'province'}).success((res) => {
                //     this.provinceArr = res.data;
                // })
                this.loadData();
                $('.page').show();
            },
            methods: {
                sendurgent: function (phone, manager) {
                    var param = {};
                    param.UserId = SiteConfig.account.id;
                    param.phone = phone;
                    param.manager = manager;
                    param.wf_eventName = SiteConfig.account.userName + "催巡";
                    param.wf_eventMsg = "加紧巡查";
                    HttpUtil.get('GovStatistics/urgent', param).success((res) => {
                        if (res.state == 0) {
                            this.$message({
                                message: '催办成功！',
                                type: 'success'
                            });
                        } else {
                            this.$message({
                                message: res.errMsg,
                                type: 'warning'
                            })
                        }
                    });
                },
                getRiskList: function (projectNo) {
                    var param = {};
                    vuePage.rcheckprojectNo = projectNo;
                    param.projectNo = vuePage.rcheckprojectNo;
                    param.pagesize = vuePage.rpageSize;
                    param.pageno = vuePage.rcurrentPage;
                    HttpUtil.get('GovStatistics/RiskList', param).success((res) => {
                        vuePage.dlgAlarmVisible = true;
                        vuePage.rtaskData = res.data;
                        vuePage.rtotalCount = res.total;
                    });
                },
                getTaskList: function (projectNo) {
                    var param = {};
                    vuePage.checkprojectNo = projectNo;
                    param.projectNo = vuePage.checkprojectNo;
                    param.pagesize = vuePage.tpageSize;
                    param.pageno = vuePage.tcurrentPage;
                    HttpUtil.get('Risk/taskList', param).success((res) => {
                        vuePage.taskDataVisible = true;
                        this.taskData = [];
                        let obj = res.data;
                        for (var i = 0; i < obj.length; i++) {
                            var name = "";
                            for (var j = 0; j < obj[i].group.length; j++) {
                                name += obj[i].group[j].userName;
                                if (j < obj[i].group.length - 1)
                                    name += ",";
                            }
                            var p = obj[i].task;
                            p.name = name;
                            this.taskData.push(p);
                        }
                        // vuePage.taskData = res.data;
                        vuePage.ttotalCount = res.total;
                    })
                }
                ,
                ronChangePage: function (page) {
                    this.rcurrentPage = page;
                    getRiskList(this.rcheckprojectNo);
                }
                ,
                tonChangePage: function (page) {
                    this.tcurrentPage = page;
                    getTaskList(this.checkprojectNo);
                }
                ,
                search: function () {
                    vuePage.showDetail(vuePage.form.zone, vuePage.form.projectName);
                }
                ,
                showDetail(zone, projectName) {
                    if (zone) {
                        var param = {};
                        param.zone = zone == '全部' ? '' : zone;
                        if (projectName)
                            param.projectName = projectName;
                        param.pageno = 1;
                        param.pagesize = 1000;
                        mapLoading = this.$loading({
                            lock: true,
                            text: '地图加载中',
                            spinner: 'el-icon-loading',
                            background: 'rgba(0, 0, 0, 0.7)'
                        });
                        HttpUtil.getV2('GovStatistics/getZoneByBusinessRisk', param).success((res) => {
                            if (res.data.length > 0) {
                                vuePage.DetailData = res.data;
                                var param = {};
                                if (projectName)
                                    param.projectName = projectName;
                                param.UserId = SiteConfig.account.id;
                                param.zone = zone == '全部' ? '' : zone;
                                ;
                                param.pageno = 1;
                                param.pagesize = 1000;
                                this.pro_totalCount = zone == '全部' ? res.total : this.pro_totalCount;
                                HttpUtil.getV2('GovStatistics/getBusinessRiskPercent', param).success((res) => {
                                    this.device = res.data;
                                    // for (var i = 0; i < vuePage.DetailData.length; i++) {
                                    //     for (var j = 0; j < res.data.length; j++) {
                                    //         if (vuePage.DetailData[i].projectName == res.data[j].projectName) {
                                    //             $.extend(vuePage.DetailData[i], res.data[j]);
                                    //             break;
                                    //         }
                                    //     }
                                    // }

                                    for (var i = 0; i < res.data.length; i++) {
                                        for (var j = 0; j < vuePage.DetailData.length; j++) {
                                            if (vuePage.DetailData[j].projectName == res.data[i].projectName) {
                                                $.extend(vuePage.DetailData[j], res.data[i]);
                                                break;
                                            }
                                        }
                                    }


                                    // for (var i = 0; i < res.data.length; i++) {
                                    //     if (vuePage.DetailData[i].projectName == res.data[i].projectName) {
                                    //         $.extend(vuePage.DetailData[i], res.data[i]);
                                    //     }
                                    // }
                                    // vuePage.DtotalCount = res.total;

                                    vuePage.MapCreated();
                                    $('#notice').empty();
                                    $('.notice li:even').addClass('lieven');
                                    $("div .notice").myScroll({
                                        speed: 60, //数值越大，速度越慢
                                        rowHeight: 60 //li的高度
                                    });
                                    for (let item of vuePage.DetailData) {
                                        $('#notice').append('<li><p><span>' + item.projectName + '</span><span>' + item.total + '</span> <span>' + item.finishedrate + '</span></p></li>')
                                    }
                                })
                            } else {
                                $('#notice').append('<li><p><span>无企业</span><span>无风险点</span></p></li>')
                                this.$message({
                                    type: 'info',
                                    message: '未有企业信息！'
                                });

                                vuePage.MapCreated();
                            }
                        });
                    } else {
                        this.$message({
                            type: 'error',
                            message: '未有企业信息！'
                        });
                    }
                }
                ,
                loadData: function () {
                    var param = {};
                    param.UserId = SiteConfig.account.id;
                    param.pageno = this.pageno;
                    param.pagesize = 50;
                    HttpUtil.get('GovStatistics/getGovCheckRiskByZone', param).success((res) => {
                        // vuePage.tableData = res.data;
                        // vuePage.totalCount = res.total;
                        // vuePage.totalCount = res.total;
                        vuePage.zoneArr.push('全部');
                        for (var i = 0; i < res.data.length; i++) {
                            vuePage.zoneArr.push(res.data[i].zone)
                        }

                        vuePage.form.zone = '全部';
                        vuePage.showDetail(vuePage.form.zone);
                    });
                    param.UserId = SiteConfig.account.id;
                    param.pageno = 1;
                    param.pagesize = 40;
                    HttpUtil.get('GovStatistics/getCompanyNumberByZone', param).success((res) => {
                        this.zone_data = res.data;
                        this.drawZoneChart()
                    })
                    HttpUtil.get('GovStatistics/getGovCheckRiskByZone', param).success((res) => {
                        this.risk_data = res.data;
                        this.drawRiskPointChart();
                    });

                    HttpUtil.getV2('GovStatistics/getRiskPercentByZone', param).success((res) => {
                        this.zone_patrol = res.data;
                        this.drawZonePatrol();
                    })

                    HttpUtil.getV2('GovStatistics/getWhole', param).success((res) => {
                        console.log(res.data)
                        this.risk_detail = res.data[0];
                    })

                }
                ,
                drawRiskPointChart() {

                    let chartData = {
                        xdatas: [],
                        ones: [],
                        twos: [],
                        threes: [],
                        fours: [],
                    };
                    for (let item of this.risk_data) {
                        chartData.xdatas.push(item.zone);
                        chartData.ones.push(item.one);
                        chartData.twos.push(item.two);
                        chartData.threes.push(item.three);
                        chartData.fours.push(item.four);
                    }
                    let option = {
                        color: ["#d73530", "#E6A23C", "#fbbd08", "#0081ff"],
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                            }
                        },
                        legend: {
                            data: ['重大风险点', '较大风险点', '一般风险点', '低风险点'],
                            textStyle: {
                                color: '#FFFFFF',
                            }
                        },
                        toolbox: {
                            show: true,
                            feature: {
                                dataView: {readOnly: false},
                                magicType: {type: ['line', 'bar']},
                                restore: {},
                                saveAsImage: {}
                            },
                            iconStyle: {
                                color: 'white'
                            },
                            top: '30',//距上
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: chartData.xdatas,
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    },
                                    interval: 0,//横轴信息全部显示
                                    rotate: -30,//-30度角倾斜显示
                                },
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            }
                        ],
                        series: [
                            {
                                name: '重大风险点',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.ones
                            },
                            {
                                name: '较大风险点',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.twos
                            },
                            {
                                name: '一般风险点',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.threes
                            },
                            {
                                name: '低风险点',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.fours
                            },
                        ]
                    };
                    let myChart = echarts.init(document.getElementById('risk_point_chart'));
                    myChart.setOption(option);
                    window.onresize = function () {
                        myChart.resize();//
                    }
                },
                drawZoneChart() {
                    let total = {
                        ones: 0,
                        twos: 0,
                        threes: 0,
                        fours: 0,
                    };
                    let chartData = {
                        xdatas: [],
                        ones: [],
                        twos: [],
                        threes: [],
                        fours: [],
                    };
                    for (let item of this.zone_data) {
                        chartData.xdatas.push(item.zone);
                        chartData.ones.push(item.one);
                        chartData.twos.push(item.two);
                        chartData.threes.push(item.three);
                        chartData.fours.push(item.four);
                        total.ones += item.one;
                        total.twos += item.two;
                        total.threes += item.three;
                        total.fours += item.four;
                    }
                    let mychart1 = echarts.init(document.getElementById('zone_pro'));
                    let option1 = {
                        color: ["#d73530", "#E6A23C", "#fbbd08", "#0081ff"],
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                            }
                        },
                        legend: {
                            data: ['重大风险', '较大风险', '一般风险', '低风险'],
                            textStyle: {
                                color: '#FFFFFF',
                            }
                        },
                        toolbox: {
                            show: true,
                            feature: {
                                dataView: {readOnly: false},
                                magicType: {type: ['line', 'bar']},
                                restore: {},
                                saveAsImage: {}
                            },
                            iconStyle: {
                                color: 'white'
                            },
                            top: '30',//距上
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: chartData.xdatas,
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    },
                                    interval: 0,//横轴信息全部显示
                                    rotate: -30,//-30度角倾斜显示
                                },
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            }
                        ],
                        series: [
                            {
                                name: '重大风险',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.ones
                            },
                            {
                                name: '较大风险',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.twos
                            },
                            {
                                name: '一般风险',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.threes
                            },
                            {
                                name: '低风险',
                                type: 'bar',
                                stack: '总量',

                                data: chartData.fours
                            },
                        ]
                    };
                    mychart1.setOption(option1);
                    window.onresize = function () {
                        mychart1.resize();//

                    }
                },
                drawZonePatrol() {
                    let chartData = {
                        xdatas: [],
                        finishedrate: []
                    };
                    for (let item of this.zone_patrol) {
                        chartData.xdatas.push(item.zone);
                        chartData.finishedrate.push(item.finishedrate);
                    }
                    let option = {
                        color: ["#d73530", "#E6A23C", "#fbbd08", "#0081ff"],
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                            }
                        },
                        legend: {
                            data: ['巡检完成率'],
                            textStyle: {
                                color: '#FFFFFF',
                            }
                        },
                        toolbox: {
                            show: true,
                            feature: {
                                dataView: {readOnly: false},
                                magicType: {type: ['line', 'bar']},
                                restore: {},
                                saveAsImage: {}
                            },
                            iconStyle: {
                                color: 'white'
                            },
                            top: '30',//距上
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: chartData.xdatas,
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    },
                                    interval: 0,//横轴信息全部显示
                                    rotate: -30,//-30度角倾斜显示
                                },
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            }
                        ],
                        series: [
                            {
                                name: '巡检完成率',
                                type: 'line',
                                stack: '总量',

                                data: chartData.finishedrate
                            },
                        ]
                    };
                    let myChart = echarts.init(document.getElementById('patrol_zone'));
                    myChart.setOption(option);
                    window.onresize = function () {
                        myChart.resize();//
                    }
                },
                zoneChange(value) {
                    console.log(this.form.zone);
                    vuePage.showDetail(vuePage.form.zone);
                }
                ,
                makeSure: function (row) {
                    let processparam = {
                        Id: row.Id,
                        reason: '已确认',
                        memo: '已确认',
                        user: SiteConfig.account.userName,
                        time: TimeUtil.convertToString(new Date()).substr(0, 10),
                        LogDate: row.LogDate,
                    }
                    HttpUtil.get('Error/Process', processparam).success(data => {
                        if (data.state == 0) {
                            this.$message({
                                message: '确认成功！',
                                type: 'success'
                            });
                            this.getError();
                        } else {
                            this.$message({
                                message: data.errMsg,
                                type: 'warning'
                            })
                        }
                    })
                }
                ,
                MapCreated() {

                    this.map = null;
                    let map = new BMap.Map('allmap', {mapType: BMAP_SATELLITE_MAP});
                    map.setMapStyle(SiteConfig.mapStyle)

                    if (this.DetailData.length == 0) {
                        map.centerAndZoom(new BMap.Point(113.753394, 34.765869), 8);
                        map.enableScrollWheelZoom();
                        map.addControl(new BMap.MapTypeControl());
                        mapLoading.close();
                        return;
                    }

                    let center_locat = this.convertGCJ02ToBD09(this.DetailData[0].lng, this.DetailData[0].lat);
                    map.centerAndZoom(new BMap.Point(center_locat.lng, center_locat.lat), 12);
                    map.enableScrollWheelZoom();
                    map.addControl(new BMap.MapTypeControl());
                    this.map = map;
                    var bdary = new BMap.Boundary();
                    if (this.form.zone != '全部') {
                        bdary.get(this.form.zone, function (rs) {       //获取行政区域
                            // map.clearOverlays();        //清除地图覆盖物
                            var count = rs.boundaries.length; //行政区域的点有多少个
                            if (count === 0) {
                                this.$message({
                                    message: "未能获取当前输入行政区域",
                                    type: 'warning'
                                })
                                return;
                            }
                            var pointArray = [];
                            for (var i = 0; i < count; i++) {
                                var ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: "#ff0000"}); //建立多边形覆盖物
                                map.addOverlay(ply);  //添加覆盖物
                                pointArray = pointArray.concat(ply.getPath());
                            }
                            map.setViewport(pointArray);    //调整视野
                        });
                    };


                    /**
                     * 标点 -1无监测设备0离线1正常2电压故障3其他故障
                     */
                        // this.DetailData.sort(this.keysrt('seqno', false, parseInt))
                    let points = [];  // 添加海量点数据
                    let self = this;
                    for (let i = 0; i < this.DetailData.length; i++) {
                        let temp_locat = this.convertGCJ02ToBD09(this.DetailData[i].lng, this.DetailData[i].lat);
                        this.DetailData[i].lng = temp_locat.lng;
                        this.DetailData[i].lat = temp_locat.lat;
                        let stroke_color = '#39b54a';
                        let url = "";
                        if (this.DetailData[i].finishedrate >= 0 && this.DetailData[i].finishedrate < 60) {
                            url = "../../../imgs/marker-alarm2.png";
                        } else if (this.DetailData[i].finishedrate >= 60 && this.DetailData[i].finishedrate < 70) {
                            url = "../../../imgs/marker-alarm3.png";
                        }
                        else if (this.DetailData[i].finishedrate >= 70 && this.DetailData[i].finishedrate < 80) {
                            url = "../../../imgs/marker-alarm1.png";
                        }
                        else if (this.DetailData[i].finishedrate >= 80 && this.DetailData[i].finishedrate <= 100) {
                            url = "../../../imgs/marker-alarm0.png";
                        }
                        let myIcon = new BMap.Icon(url, new BMap.Size(45, 45));
                        let label = new BMap.Label(this.DetailData[i].projectName, {
                            offset: new BMap.Size(20, -10)
                        });
                        let marker = new BMap.Marker(new BMap.Point(this.DetailData[i].lng, this.DetailData[i].lat), {
                            icon: myIcon
                        });
                        marker.setLabel(label);

                        marker.setAnimation((this.DetailData[i].finishedrate >= 0 && this.DetailData[i].finishedrate < 60) ? BMAP_ANIMATION_BOUNCE : BMAP_ANIMATION_DROP); //跳动的动

                        marker.addEventListener("click", function () {
                            vuePage.sel_pro = self.DetailData[i];
                            self.DetailData[i].address = self.DetailData[i].address ? self.DetailData[i].address : ''
                            let sContent =
                                // "<div style='margin:0 0 5px 0;padding:0.2em 0'>" + self.DetailData[i].projectName +
                                // "<button onclick='showDetail()' style='float: right'>查看数据</button>" +
                                // "</div>" +
                                "<h3>基本信息<button style='float: right;margin-top:24px' onclick='showProDetail(&quot;" + self.DetailData[i].projectNo + "&quot;)'>查看明细</button><h3/>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>企业名称：" + self.DetailData[i].projectName + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>企业地址：" + self.DetailData[i].province + self.DetailData[i].city + self.DetailData[i].zone + self.DetailData[i].address + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>联系姓名：" + self.DetailData[i].manager + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>联系电话：" + self.DetailData[i].phone + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>运营单位：" + self.DetailData[i].chiefName + "</p>" +
                                "<hr />" +
                                "<h3>安全风险管控信息(已管控)<h3 />" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>风险清单风险点总数:" + (self.DetailData[i].one + self.DetailData[i].two + self.DetailData[i].three + self.DetailData[i].four) + "处</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>【Ⅰ级:" + self.DetailData[i].one + "处;Ⅱ级:" + self.DetailData[i].two + "处;Ⅲ级:" + self.DetailData[i].three + "处;Ⅳ级:" + self.DetailData[i].four + "处;】</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>任务总数" + self.DetailData[i].total + ",未完成数" + self.DetailData[i].finish + ",完成数" + self.DetailData[i].finished + ",超时数" + self.DetailData[i].finish_timeout + ",完成率" + self.DetailData[i].finishedrate + "%</p>" +
                                // "<p><button onclick='sendurgent(&quot;" + self.DetailData[i].phone + "&quot;,&quot;" + self.DetailData[i].manager + "&quot;)' style='float: right;background:red;color:white'>催办</button></p></br></br>" +

                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>风险责任清单：<button onclick='getTaskList(&quot;" + self.DetailData[i].projectNo + "&quot;)' style='float: right'>查看数据</button></p></br>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>风险管控清单：<button onclick='getRiskList(&quot;" + self.DetailData[i].projectNo + "&quot;)' style='float: right'>查看数据</button></p>";
                            let infoWindow = new BMap.InfoWindow(sContent); // 创建信息窗口对象
                            this.openInfoWindow(infoWindow);
                        });
                        points.push(new BMap.Point(this.DetailData[i].lng, this.DetailData[i].lat));
                        if (this.form.zone != '全部' || this.form.projectName) {
                            map.addOverlay(marker);
                            mapLoading.close();
                        }
                    }
                    if (this.form.zone == '全部' && !this.form.projectName) {
                        var options = {
                            size: BMAP_POINT_SIZE_HUGE,
                            shape: BMAP_POINT_SHAPE_STAR,
                            color: 'aqua'
                        }
                        let pointCollection = new BMap.PointCollection(points, options);
                        pointCollection.addEventListener("click", function (e) {
                            for (let i = 0; i < self.DetailData.length; i++) {
                                if (self.DetailData[i].lng == e.point.lng && e.point.lat == self.DetailData[i].lat) {
                                    vuePage.sel_pro = self.DetailData[i];
                                    break;
                                }
                            }
                            vuePage.sel_pro.address = vuePage.sel_pro.address ? vuePage.sel_pro.address : ''
                            let sContent =
                                // "<div style='margin:0 0 5px 0;padding:0.2em 0'>" + self.DetailData[i].projectName +
                                // "<button onclick='showDetail()' style='float: right'>查看数据</button>" +
                                // "</div>" +
                                "<h3>基本信息<button style='float: right;margin-top:24px' onclick='showProDetail(&quot;" + vuePage.sel_pro.projectNo + "&quot;)'>查看明细</button><h3/>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>企业名称：" + vuePage.sel_pro.projectName + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>企业地址：" + vuePage.sel_pro.province + vuePage.sel_pro.city + vuePage.sel_pro.zone + vuePage.sel_pro.address + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>联系姓名：" + vuePage.sel_pro.manager + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>联系电话：" + vuePage.sel_pro.phone + "</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>运营单位：" + vuePage.sel_pro.chiefName + "</p>" +
                                "<hr />" +
                                "<h3>安全风险管控信息(已管控)<h3 />" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>风险清单风险点总数:" + (vuePage.sel_pro.one + vuePage.sel_pro.two + vuePage.sel_pro.three + vuePage.sel_pro.four) + "处</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>【Ⅰ级:" + vuePage.sel_pro.one + "处;Ⅱ级:" + vuePage.sel_pro.two + "处;Ⅲ级:" + vuePage.sel_pro.three + "处;Ⅳ级:" + vuePage.sel_pro.four + "处;】</p>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>任务总数" + vuePage.sel_pro.total + ",未完成数" + vuePage.sel_pro.finish + ",完成数" + vuePage.sel_pro.finished + ",超时数" + vuePage.sel_pro.finish_timeout + ",完成率" + vuePage.sel_pro.finishedrate + "%</p>" +
                                // "<p><button onclick='sendurgent(&quot;" + vuePage.sel_pro.phone + "&quot;,&quot;" + vuePage.sel_pro.manager + "&quot;)' style='float: right;background:red;color:white'>催办</button></p></br></br>" +

                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>风险责任清单：<button onclick='getTaskList(&quot;" + vuePage.sel_pro.projectNo + "&quot;)' style='float: right'>查看数据</button></p></br>" +
                                "<p style='margin:0;line-height:1.3;font-size:13px;text-indent:2em'>风险管控清单：<button onclick='getRiskList(&quot;" + vuePage.sel_pro.projectNo + "&quot;)' style='float: right'>查看数据</button></p>";
                            let infoWindow = new BMap.InfoWindow(sContent); // 创建信息窗口对象
                            map.openInfoWindow(infoWindow, new BMap.Point(vuePage.sel_pro.lng, vuePage.sel_pro.lat)); //开启信息窗口
                        });
                        map.addOverlay(pointCollection);
                        mapLoading.close();
                    }

                },
                // 排序方法
                keysrt(filed, rev, primer) {
                    rev = (rev) ? -1 : 1;
                    return function (a, b) {
                        a = a[filed];
                        b = b[filed];
                        if (typeof (primer) != 'undefined') {
                            a = primer(a);
                            b = primer(b);
                        }
                        if (a < b) {
                            return rev * -1;
                        }
                        if (a > b) {
                            return rev * 1;
                        }
                        return 1;
                    }
                }
                ,
                convertGCJ02ToBD09(lng1, lat1) {
                    let xpi = Math.PI * 3000.0 / 180.0;
                    let z = Math.sqrt(lng1 * lng1 + lat1 * lat1) + 0.00002 * Math.sin(lat1 * xpi);
                    let theta = Math.atan2(lat1, lng1) + 0.000003 * Math.cos(lng1 * xpi);
                    let lng = z * Math.cos(theta) + 0.0065;
                    let lat = z * Math.sin(theta) + 0.006
                    return {
                        lng: lng,
                        lat: lat,

                    }
                }
                ,
                handleDetail(key) {
                    this.pro_safe_visible = true;
                    switch (key) {
                        case 'risk_point':
                            this.page_url = '../../prevention/risk-manage/risk-identification.html?projectNo=' + this.sel_pro.projectNo;
                            break;
                        case 'dev_bill':
                            this.page_url = '../../prevention/safebill-manage/devicesbill.html?projectNo=' + this.sel_pro.projectNo;
                            break;
                        case 'risk_sources':
                            this.page_url = '../../prevention/safebill-manage/risksourcebill.html?projectNo=' + this.sel_pro.projectNo;
                            break;
                        case 'fire_sources':
                            this.page_url = '../../prevention/safebill-manage/firebill.html?projectNo=' + this.sel_pro.projectNo;
                            break;
                        case 'work_task':
                            this.page_url = '../../prevention/system-manage/workflow.html?projectNo=' + this.sel_pro.projectNo;
                            break;

                    }
                },
                handleNotice() {
                    if (!this.flag) {
                        this.getError();
                    } else {
                        $('#audioDiv').empty();
                    }
                    this.flag = !this.flag;
                },
                alarmDetail(index) {
                    this.alarmVisible = true;
                    setTimeout(() => {
                        //告警分布
                        HttpUtil.get('Analysis/getUserErrorGroupSummary', {
                            UserId: this.tableAlarm[index].projectOwner,
                            year: 0,
                            month: 0
                        }).success((res) => {
                            let data = {
                                xdata: [],
                                ydata: [],
                                count: 0,
                            }
                            if (res.data.length != 0)
                                for (let item of res.data) {
                                    data.xdata.push(item.groupName);
                                    data.ydata.push({
                                        value: item.errorCount,
                                        name: item.groupName,
                                        Id: item.Id
                                    })
                                    data.count += item.errorCount;
                                }
                            let alarmChart2 = echarts.init(document.getElementById('alarmChart2'));
                            alarmChart2.setOption(this.retRow24Option(data));
                        })
                    }, 0)
                },
                retRow24Option(data) {
                    var colorList = ["#f6d54a", "#f69846", "#44aff0", "#45dbf7", "#f845f1", "#ad46f3", "#5045f6", "#4777f5"];
                    var colorListSub = ['rgba(35,143,56,.5)', 'rgba(26,87,178,.5)', 'rgba(176,75,7,.5)', 'rgba(175,129,8,.5)'];
                    return {
                        tooltip: {
                            trigger: 'item',
                            // formatter: "{b}:({d}%)"
                            formatter: function (param) {
                                return param.name + ':' + param.value;
                            },
                        },
                        grid: {
                            top: '0%',
                        },
                        legend: {
                            orient: 'horizontal',
                            textStyle: {
                                color: '#fff'
                            },
                            left: 'center',
                            bottom: '8%',
                            data: data.xdata
                        },
                        series: [
                            {
                                type: 'pie',
                                radius: [20, '56%'],
                                center: ["50%", "38%"],
                                roseType: 'radius',
                                clockwise: false,
                                z: 10,
                                itemStyle: {
                                    normal: {
                                        color: function (params) {
                                            // build a color map as your need.
                                            return colorList[params.dataIndex]
                                        },
                                        shadowBlur: 20,
                                        shadowColor: 'rgba(0, 0, 0, 0.3)'
                                    }
                                },
                                label: {
                                    normal: {
                                        formatter: function (param) {
                                            //console.log(param.percent,"param")
                                            return Math.round(param.percent) + "%"
                                        },
                                        textStyle: {
                                            backgroundColor: "rgba(3,48,85,0.6)",
                                            padding: 6
                                        }
                                    }
                                },
                                labelLine: {
                                    normal: {
                                        length: 10,
                                        length2: 10,
                                        lineStyle: {
                                            width: 1
                                        }
                                    }
                                },
                                data: data.ydata
                            },

                            // 中心的圆圈
                            {
                                radius: ['60%', '62%'],
                                center: ["50%", "38%"],
                                color: '#FFFFFF',
                                type: 'pie',
                                label: {
                                    normal: {
                                        show: false
                                    },
                                    emphasis: {
                                        show: false
                                    }
                                },
                                labelLine: {
                                    normal: {
                                        show: false
                                    },
                                    emphasis: {
                                        show: false
                                    }
                                },
                                tooltip: {
                                    show: false
                                },
                                data: [{
                                    value: data.count,
                                    name: '告警总数',
                                    itemStyle: {
                                        normal: {
                                            color: '#5A96FF',
                                        }
                                    }
                                }],
                                animation: false
                            }
                        ]
                    };
                },
                getReport() {
                    this.reportVisible = true;
                    setTimeout(() => {
                        this.project_alarm_page.pageno = 1;
                        this.getAlarmCount();
                        this.getProAlarmList();
                    }, 100)

                },
                printData() {
                    var printhtml = document.getElementById('print').innerHTML;
                    // 生成并打印ifrme
                    printhtml += '    <link rel="stylesheet" href="../../../assets/bundle.element.css">\n' +
                        '    <link rel="stylesheet" href="../../../style.css">'
                    var f = document.getElementById('printf');
                    f.contentDocument.write(printhtml);
                    f.contentDocument.close();
                    f.contentWindow.print();

                },
                getAlarmCount() {
                    var _self = this;

                    //报警类别柱状图
                    var param = {
                        UserId: 0, //0表示当前用户
                        year: 0,//0表示当前年
                        month: 0, //0表示当前月
                        day: 0,//0表示当前天
                    };
                    HttpUtil.get('Analysis/getUserErrorGroupSummary', param).success((res) => {
                        let data = {
                            xdata: [],
                            ydata: [],
                            count: 0,
                        }
                        this.alarmCount = res.data;
                        for (let item of res.data) {
                            data.xdata.push(item.groupName);
                            data.ydata.push({
                                value: item.errorCount,
                                name: item.groupName
                            })
                            data.count += item.errorCount;
                        }
                        let myChart = echarts.init(document.getElementById('alarm_Count'));
                        let option = {
                            tooltip: {
                                trigger: 'item',
                                formatter: "{a} <br/>{b}: {c} ({d}%)"
                            },
                            legend: {
                                orient: 'vertical',
                                right: 0,
                                top: 20,
                                left: 'auto',
                                data: data.xdata,
                                textStyle: {
                                    color: '#12E5FF'
                                }
                            },
                            grid: {
                                containLabel: true //包含标签
                            },
                            graphic: {
                                type: 'text',
                                left: 'center',
                                top: 'center',
                                z: 2,
                                style: {
                                    text: data.count,
                                    fontSize: 20,
                                    fill: '#12E5FF',
                                }
                            },
                            series: [
                                {
                                    name: '告警分类',
                                    type: 'pie',
                                    radius: ['50%', '70%'],
                                    avoidLabelOverlap: false,
                                    label: {
                                        normal: {
                                            show: false,
                                            position: 'center'
                                        },
                                        emphasis: {
                                            show: true,
                                            textStyle: {
                                                fontSize: '30',
                                                fontWeight: 'bold'
                                            }
                                        }
                                    },
                                    labelLine: {
                                        normal: {
                                            show: false
                                        }
                                    },
                                    data: data.ydata
                                }
                            ]
                        };
                        myChart.setOption(option);
                    });

                },
                handleProCurrentChange(page) {
                    this.project_alarm_page.pageno = page;
                    this.getProAlarmList();
                },
                getProAlarmList() {
                    let day = TimeUtil.convertToString(new Date()).substr(0, 10);
                    let dArr = day.split('-');
                    this.project_alarm_page.year = dArr[0];
                    this.project_alarm_page.month = dArr[1];
                    this.project_alarm_page.day = dArr[2];
                    this.project_alarm_page.summaryType = 1;
                    HttpUtil.get('User/getErrorSummary', this.project_alarm_page).success((r) => {
                        this.pro_alarm_table = r.data;
                        this.project_alarm_page.totalCount = r.total;
                    });
                    let topSummary = {
                        year: dArr[0],
                        month: dArr[1],
                        day: dArr[2],
                        summaryType: 0,
                        UserId: SiteConfig.account.id,
                    }
                    HttpUtil.get('User/getErrorSummary', topSummary).success((r) => {
                        this.totalSum = r.data[0];
                    });
                    let zoneParam = {
                        year: dArr[0],
                        month: dArr[1],
                        day: dArr[2],
                        summaryType: 2,
                        UserId: SiteConfig.account.id,
                    }
                    HttpUtil.get('User/getErrorSummary', zoneParam).success((r) => {
                        this.zoneSum = r.data.projectSummary;
                    });
                },
                search_pro() {
                    this.project_alarm_page.pageno = 1;
                    this.getProAlarmList();
                },
                pro_alarm_detail(index) {
                    this.innerVisible = true;
                    this.pro_alram_name = this.pro_alarm_table[index].projectName;
                    this.prodata = this.pro_alarm_table[index];
                    this.day_alarm_page.beginTime = TimeUtil.convertToString(new Date()).substr(0, 10);
                    this.day_alarm_page.projectNo = this.pro_alarm_table[index].projectNo;
                    this.day_alarm_page.projectName = this.pro_alarm_table[index].projectName;
                    this.day_alarm_page.pageno = 1;
                    this.getProWarning();
                },
                handleDayCurrentChange(page) {
                    this.day_alarm_page.pageno = page;
                    this.getProWarning();
                },
                getProWarning() {
                    HttpUtil.get('Error/List', this.day_alarm_page).success((r) => {
                        this.day_alarm_page.totalCount = r.total;
                        this.day_Error_table = r.data;
                    })
                    HttpUtil.get('project/list', {projectNo: this.prodata.projectNo}).success((res) => {
                        this.prodata = res.data[0];
                    })
                },
                showProDetail(projectNo) {
                    const loading = this.$loading({
                        lock: true,
                        text: '正在获取企业信息...',
                        spinner: 'el-icon-loading',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    HttpUtil.getV2('WorkFlow/List', {
                        pagesize: 5,
                        pageno: 1,
                        wf_objType: 8,
                        wf_projectNo: this.sel_pro.projectNo
                    }).success((r) => {
                        for (let i = 0; i < r.data.length; i++) {
                            if (r.data[0].image1.indexOf('http') != -1) {
                                r.data[0].image1 = r.data[0].image1;
                            } else {
                                r.data[0].image1 = this.imageUrl + r.data[0].image1;
                            }
                        }
                        this.wf_datas = r.data;
                    })
                    HttpUtil.get('project/list', {projectNo: this.sel_pro.projectNo}).success((res) => {
                        this.prodata = res.data[0];
                        this.centerDialogVisible = true;
                        loading.close();

                        this.activeName = 'danger_tab';
                        let day = TimeUtil.convertToString(new Date()).substr(0, 10);
                        let dArr = day.split('-');

                        HttpUtil.get('GovStatistics/getCompanyEvaluateDay', {projectNo: this.sel_pro.projectNo}).success((res) => {
                            let data = {
                                xdatas: [],
                                ydatas: [],
                                point1: [],
                                point2: [],
                                point3: [],
                                point4: [],
                                point5: [],
                            }
                            for (let temp of res.data) {
                                data.xdatas.push(temp.sumDate.split('T')[0].split('-')[2]);
                                data.ydatas.push(temp.fraction);
                                data.point1.push(temp.S1);
                                data.point2.push(temp.S2);
                                data.point3.push(temp.S3);
                                data.point4.push(temp.S4);
                                data.point5.push(temp.S5);
                            }

                            this.trend_option = {
                                titel: '',
                                x: data.xdatas,
                                y: [
                                    {
                                        name: '安全指数',
                                        value: data.ydatas
                                    },
                                ]
                            },
                                this.point_option = {
                                    title: '',
                                    x: data.xdatas,
                                    y: [
                                        {name: '巡检完成率', value: data.point1},
                                        {name: '告警处理率', value: data.point2},
                                        {name: '隐患整改率', value: data.point3},
                                        {name: '处理时效', value: data.point4},
                                        {name: '设备正常率', value: data.point5},
                                    ]
                                };
                        })

                        HttpUtil.get('GovStatistics/getSafeEvaluation', {projectNo: this.sel_pro.projectNo}).success((res) => {
                            this.safe_count_data = res.data[0];
                        })

                        HttpUtil.get('GovStatistics/getRiskWarningDay', {
                            projectNo: this.sel_pro.projectNo,
                            sumDate: TimeUtil.convertToString(new Date()).substr(0, 10)
                        }).success((r) => {
                            if (r.data.length == 0) {
                                r.data[0] = {
                                    K1: '1',
                                    K2: '1',
                                    K3: '1',
                                    K4: '1',
                                    K5: '1',
                                    S1: 15,
                                    S2: 20,
                                    S3: 20,
                                    S4: 20,
                                    S5: 20,
                                }
                            }
                            this.company_today_kpi = r.data[0];
                            let mychart = echarts.init(document.getElementById('danger_group'));
                            let option = {
                                tooltip: {},
                                radar: {
                                    // shape: 'circle',
                                    name: {
                                        textStyle: {
                                            color: '#fff',
                                            backgroundColor: '#999',
                                            borderRadius: 3,
                                            padding: [3, 5]
                                        }
                                    },
                                    indicator: [
                                        {name: '巡检完成率', max: 30},
                                        {name: '告警处理率', max: 30},
                                        {name: '隐患整改率', max: 20},
                                        {name: '处理时效', max: 10},
                                        {name: '设备正常率', max: 10}
                                    ]
                                },
                                series: [{
                                    name: '风险要素',
                                    type: 'radar',
                                    // areaStyle: {normal: {}},
                                    data: [
                                        {
                                            value: [r.data[0].S1, r.data[0].S2, r.data[0].S3, r.data[0].S4, r.data[0].S5],
                                        },

                                    ]
                                }]
                            };
                            mychart.setOption(option);
                        })


                    })

                },
                handTabClick(tab) {
                    switch (tab.name) {
                        case "video_tab":
                            HttpUtil.get('VideoCaptor/list', {
                                projectNo: this.sel_pro.projectNo,
                                pagesize: 200
                            }).success((res) => {
                                this.videoData = res.data
                                if (res.data.length == 0) {
                                    $("#myDivPlayer").html('');
                                } else {


                                    this.handleSelect(0);
                                }

                            })
                            break;
                        case 'monitor_tab':
                            HttpUtil.get('Device/ListByModType', {projectNo: this.sel_pro.projectNo}).success((r) => {
                                for(let i in r.data){
                                    for(let m in r.data[i]){
                                        r.data[i][m].online = 1
                                    }
                                }
                                this.dev_datas = r.data;
                            })
                            break;
                        case 'safe_situation':
                            const imgjson = {
                                "执勤队站": 5,
                                "派出所": 6,
                                "微型消防站": 7,
                                "消火栓": 8,
                                "消防水池": 9,
                                "天然水源": 10,
                                "消防车": 11,
                                "灭火器": 12,
                                "破拆工具": 13,
                                "企业专职消防队": 16,
                                "登高车": 17,
                                "一级单位": 19,
                                "二级单位": 20,
                                "三级单位": 21,
                            };
                            /**
                             * 116.334651,39.970152
                             * 116.371445,39.985744
                             * 116.30418,39.968494
                             * @type {BMap.Map}
                             */
                            HttpUtil.get('Resource/nearby', {
                                Lng: this.sel_pro.lng,
                                Lat: this.sel_pro.lat,
                                Km: 10
                            }).success((r) => {
                                let points = r.data.detailList
                                let safe_map = new BMap.Map("safe_map");
                                safe_map.enableScrollWheelZoom();
                                safe_map.centerAndZoom(new BMap.Point(this.sel_pro.lng, this.sel_pro.lat), 15);
                                let center = new BMap.Marker(new BMap.Point(this.sel_pro.lng, this.sel_pro.lat));
                                let circle = new BMap.Circle(new BMap.Point(this.sel_pro.lng, this.sel_pro.lat), 10000, {
                                    fillColor: "blue",
                                    strokeWeight: 1,
                                    fillOpacity: 0.3,
                                    strokeOpacity: 0.3
                                });
                                safe_map.addOverlay(center);
                                safe_map.addOverlay(circle);
                                center.setAnimation(BMAP_ANIMATION_BOUNCE);
                                this.safe_map = safe_map;
                                for (let temp of points) {
                                    let pt = new BMap.Point(temp.lng, temp.lat);
                                    let myIcon = new BMap.Icon("../../../imgs/fire" + temp.srcSubType + ".png", new BMap.Size(80, 80));
                                    let marker = new BMap.Marker(pt, {icon: myIcon});  // 创建标注
                                    safe_map.addOverlay(marker);
                                    let self = this;
                                    marker.addEventListener("click", function () {

                                        self.driving_Point = {
                                            lng: temp.lng,
                                            lat: temp.lat,
                                        }
                                        let sContent =
                                            // "<div style='margin:0 0 5px 0;padding:0.2em 0'>" + self.DetailData[i].projectName +
                                            // "<button onclick='showDetail()' style='float: right'>查看数据</button>" +
                                            // "</div>" +
                                            "<h3>基本信息 <button style='float: right' onclick='driving_marker()'>规划线路</button><h3/>" +
                                            "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>消防单元：" + temp.srcName + " </p>" +
                                            "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>消防类型：" + temp.srcTypeName + "-" + temp.srcSubTypeName + " </p>" +
                                            "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>所在位置：" + temp.city + "-" + temp.zone + '-' + temp.address + " </p>";
                                        let infoWindow = new BMap.InfoWindow(sContent); // 创建信息窗口对象
                                        this.openInfoWindow(infoWindow);
                                    })
                                }
                            })
                            break;
                        case 'patrol_tab':
                            this.today_patrol_param = {
                                pagesize: 10,
                                pageno: 1,
                                projectNo: '',
                                total: 0,
                                processflag: 0
                            },
                                this.history_patrol_param = {
                                    pagesize: 10,
                                    pageno: 1,
                                    projectNo: '',
                                    total: 0,
                                    startTime: '',
                                    endTime: '',
                                    processflag: '',
                                },
                                this.getHisPatrol();
                            break;
                        case 'alarm_tab':
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                            this.company_alarm_param.date = [start, end];
                            this.getComapny_alarm();
                            break;
                        case 'mapColor_tab':
                            // 地图
                            // 百度地图API功能
                            let marker = {};
                            let map = new BMap.Map("color_map");
                            map.centerAndZoom(new BMap.Point(this.sel_pro.lng, this.sel_pro.lat), 24);
                            map.enableScrollWheelZoom(true);
                            map.setMapStyle({
                                styleJson: [
                                    {
                                        "featureType": "building",
                                        "elementType": "labels",
                                        "stylers": {
                                            "visibility": "off"
                                        }
                                    }
                                ]
                            });
                            HttpUtil.get('SceneForColor/List', {projectNo: this.sel_pro.projectNo}).success((res) => {
                                let data = res.data;
                                if (data.length > 0) {
                                    for (let i = 0; i < data.length; i++) {
                                        let color = 'blue'
                                        switch (data[i].grade) {
                                            case  1:
                                                color = 'red';
                                                break;
                                            case  2:
                                                color = 'orange';
                                                break;
                                            case  3:
                                                color = 'yellow';
                                                break;
                                            case  4:
                                                color = 'blue';
                                                break;
                                        }
                                        let rectangle = new BMap.Polygon([
                                            new BMap.Point(data[i].lng1, data[i].lat1),
                                            new BMap.Point(data[i].lng2, data[i].lat2),
                                            new BMap.Point(data[i].lng3, data[i].lat3),
                                            new BMap.Point(data[i].lng4, data[i].lat4),
                                        ], {
                                            strokeColor: "white",
                                            strokeWeight: 2,
                                            strokeOpacity: 0.5,
                                            fillColor: color,
                                        });

                                        let point = this.getCenterPoint(rectangle.getPath());
                                        let label = new BMap.Label(data[i].zone_name, {
                                            offset: new BMap.Size(-40, -25),
                                            position: point
                                        });
                                        rectangle.addEventListener("click", () => {
                                            HttpUtil.get('Patrolexcute/getRiskPercentByZone', {
                                                UserId: this.prodata.projectOwner,
                                                pagesize: 200
                                            }).success((res) => {
                                                let zoneInfo = {};
                                                let flag = false;
                                                for (let item of res.data) {
                                                    if (item.zone_id == data[i].zoneId) {
                                                        zoneInfo = item;
                                                        zoneInfo.grade = data[i].grade;
                                                        flag = true;
                                                    }
                                                }
                                                if (flag) {
                                                    this.zoneInfo = zoneInfo;
                                                    this.zoneDetailVisible = true;
                                                } else {
                                                    this.$message.warning('该区域未关联风险点')
                                                }

                                            })
                                        });
                                        map.addOverlay(label);
                                        map.addOverlay(rectangle);
                                    }
                                }
                            })
                            break;
                    }
                },
                showFourColorMap() {
                    let param = {
                        projectNo: this.sel_pro.projectNo,
                        pagesize: 20
                    }
                    HttpUtil.get('ScadaScene/List', param).success((res) => {
                        if (res.data.length == 0) {
                            this.$message.warning('未上传四色图图片文件');
                            return
                        }
                        for (let i = 0, len = res.data.length; i < len; i++) {
                            if (res.data[i].ImageName) {
                                if (res.data[i].ImageName.indexOf('http') != -1) {
                                    res.data[i].ImageName = res.data[i].ImageName;
                                } else {
                                    res.data[i].ImageName = this.imageUrl + res.data[i].ImageName;
                                }
                            }

                        }

                        this.color_pics = res.data;
                        this.four_color_visible = true
                    })
                },
                driving_marker() {
                    if (this.driving)
                        this.driving.clearResults();
                    this.driving = new BMap.DrivingRoute(this.safe_map, {
                        renderOptions: {
                            map: this.safe_map,
                            panel: "result_panel",
                            autoViewport: true
                        }
                    });
                    this.driving.search(new BMap.Point(this.sel_pro.lng, this.sel_pro.lat), new BMap.Point(this.driving_Point.lng, this.driving_Point.lat));
                },
                getCenterPoint(path) {
                    let x = 0.0;
                    let y = 0.0;
                    for (let i = 0; i < path.length; i++) {
                        x = x + parseFloat(path[i].lng);
                        y = y + parseFloat(path[i].lat);
                    }
                    x = x / path.length;
                    y = y / path.length;
                    return new BMap.Point(x, y);
                },
                handleCompanyAlarmChange(page) {
                    this.company_alarm_param.pageno = page;
                    this.getComapny_alarm();
                },
                getComapny_alarm() {
                    let param = this.company_alarm_param;
                    param.projectNo = this.sel_pro.projectNo;
                    if (param.date.length != 0) {
                        param.beginTime = param.date[0];
                        param.endTime = param.date[1];
                    }
                    HttpUtil.get('Error/List', param).success((r) => {
                        this.company_alarm_param.total = r.total;
                        this.company_alarm_table = r.data;
                    })
                },
                alarm_search() {
                    this.company_alarm_param.pageno = 1;
                    this.getComapny_alarm();
                },
                today_patrol_Page(page) {
                    this.today_patrol_param.pageno = page;
                    this.getTodayPatrol();
                },
                // getTodayPatrol() {
                //     let param = this.today_patrol_param;
                //     param.projectNo = this.sel_pro.projectNo;
                //     HttpUtil.get('Patrolexcute/getRiskStatus', param).success((res) => {
                //         this.today_patrol_param.total = res.total;
                //         this.todayPatrolData = res.data;
                //
                //     });
                // },
                his_search() {
                    this.history_patrol_param.pageno = 1;
                    this.getHisPatrol();
                },
                history_patrol_Page(page) {
                    this.history_patrol_param.pageno = page;
                    this.getHisPatrol();
                },
                getHisPatrol() {
                    let dArr = this.date.split('-');
                    let param = this.history_patrol_param;
                    param.projectNo = this.prodata.projectNo;
                    param.year = dArr[0];
                    param.month = dArr[1];
                    HttpUtil.getV2('Patrolexcute/getSupplierRiskStatusHistory', param).success((res) => {
                        if (res.state == 0) {
                            this.history_patrol_param.total = res.total;
                            for (let i = 0; i < res.data.length; i++) {
                                if (res.data[i].img) {
                                    if (res.data[i].img.indexOf('http') != -1) {
                                        res.data[i].img = res.data[i].img;
                                    } else {
                                        res.data[i].img = this.imageUrl + res.data[i].img;
                                    }
                                }
                                if (res.data[i].img1) {
                                    if (res.data[i].img1.indexOf('http') != -1) {
                                        res.data[i].img1 = res.data[i].img1;
                                    } else {
                                        res.data[i].img1 = this.imageUrl + res.data[i].img1;
                                    }
                                }
                                if (res.data[i].img2) {
                                    if (res.data[i].img2.indexOf('http') != -1) {
                                        res.data[i].img2 = res.data[i].img2;
                                    } else {
                                        res.data[i].img2 = this.imageUrl + res.data[i].img2;
                                    }
                                }
                                if (res.data[i].img3) {
                                    if (res.data[i].img3.indexOf('http') != -1) {
                                        res.data[i].img3 = res.data[i].img3;
                                    } else {
                                        res.data[i].img3 = this.imageUrl + res.data[i].img3;
                                    }
                                }
                            }
                            this.hisPatrolData = res.data;

                        }
                        else {
                            this.$message.error(res.errMsg.toString());
                        }

                    });
                },

                showPatrolDetail(id, processflag) {
                    if (processflag == 2) {
                        this.detailFormVisible = true;
                        HttpUtil.get('Executedetail/getdetail', {Id: id}).success((res) => {
                            // vuePage.DetailData = res.data.executeDetails;

                            if (res.data.patrolExecute.img) {
                                if (res.data.patrolExecute.img.indexOf('http') != -1) {
                                    res.data.patrolExecute.img = res.data.patrolExecute.img;
                                } else {
                                    res.data.patrolExecute.img = this.imageUrl + res.data.patrolExecute.img;
                                }
                            }
                            if (res.data.patrolExecute.img1) {
                                if (res.data.patrolExecute.img1.indexOf('http') != -1) {
                                    res.data.patrolExecute.img1 = res.data.patrolExecute.img1;
                                } else {
                                    res.data.patrolExecute.img1 = this.imageUrl + res.data.patrolExecute.img1;
                                }
                            }
                            if (res.data.patrolExecute.img2) {
                                if (res.data.patrolExecute.img2.indexOf('http') != -1) {
                                    res.data.patrolExecute.img2 = res.data.patrolExecute.img2;
                                } else {
                                    res.data.patrolExecute.img2 = this.imageUrl + res.data.patrolExecute.img2;
                                }
                            }
                            if (res.data.patrolExecute.img3) {
                                if (res.data.patrolExecute.img3.indexOf('http') != -1) {
                                    res.data.patrolExecute.img3 = res.data.patrolExecute.img3;
                                } else {
                                    res.data.patrolExecute.img3 = this.imageUrl + res.data.patrolExecute.img3;
                                }
                            }
                            vuePage.patrolExecute = res.data.patrolExecute;
                            var row = res.data.executeDetails;
                            var sum = 0;
                            for (var i = 0; i < row.length; i++) {
                                if (row[i].processFlag != null) {
                                    sum++;
                                }
                                if (row[i].image1) {
                                    if (row[i].image1.indexOf('http') != -1) {
                                        row[i].image1 = row[i].image1;
                                    } else {
                                        row[i].image1 = this.imageUrl + row[i].image1;
                                    }
                                }
                            }
                            vuePage.executeDetails = row;
                            vuePage.patrolExecute.patrolSum = sum;
                        });
                    } else {
                        this.$message({
                            type: 'error',
                            message: '未有详情！'
                        });
                    }
                },
                handleSelect(key) {
                    $("#myDivPlayer").html('');
                    this.sel_video = this.videoData[key];
                    let html = '<video id="myPlayer" style=" height: 100%;width:100%;min-width:320px;min-height:500px;" poster="" controls playsInline webkit-playsinline autoplay><source src="' + this.videoData[key].Url1 + '" type="" /> <source src="' + this.videoData[key].Url2 + '" type="application/x-mpegURL" /></video>';
                    let html2 = '<live-player id="player01" style=" height: 100%;width:100%;min-width:320px;min-height:500px;" video-url="' + this.videoData[key].Url1 + ' " autoplay="true" live="true" stretch="true">'
                    let html3 = '<iframe src="' + this.videoData[key].Url1 + '" width="100%" height="500" allowfullscreen allow="autoplay"></iframe>';
                    if (this.videoData[key].State == 0) {
                        $("#myDivPlayer").html(html3);
                    } else if (this.videoData[key].State == 1) {
                        $("#myDivPlayer").html(html);
                        setTimeout(() => {
                            let _videoPlayer = new EZUIPlayer('myPlayer');
                            _videoPlayer.play();
                        },10)
                    } else if (this.videoData[key].State == 2) {
                        if (this.live_timer)
                            clearInterval(this.live_timer);
                        let param = {
                            serial: '',//设备序列号
                            channel: '',//通道号
                        }
                        $.ajax({
                            url: '/api/v1/stream/start',  //直播
                            type: 'Get',
                            dataType: "json",
                            data: param,
                            async: !0,
                            timeout: 60000,
                            crossDomain: !0,
                            cache: !1,

                            success: (e, t, i) => {
                                console.log(e)
                            },
                            error: () => {
                                this.$message.error('此设备不支持控制');
                            }
                        })

                        this.live_timer = setInterval(() => {
                            $.ajax({
                                url: '/api/v1/stream/touch',  //直播流保活
                                type: 'Get',
                                dataType: "json",
                                data: param,
                                async: !0,
                                timeout: 60000,
                                crossDomain: !0,
                                cache: !1,
                                success: (e, t, i) => {
                                    console.log(e)
                                },
                                error: () => {
                                    this.$message.error('系统开小差');
                                }
                            })
                        }, 15000)
                    } else if (this.videoData[key].State == 3) {
                        let param = {
                            cameraCode: this.videoData[key].Url2,//设备序列号
                            protocol: 'rtmp',//
                        }
                        HttpUtil.get('HikVideo/previewUrl', param).success((r) => {
                            let str = '<video id="myPlayer" style=" height: 100%;width:100%;min-width:320px;min-height:500px;" poster="" controls playsInline webkit-playsinline autoplay><source src="' + r.data.url + '" /></video>';
                            $("#myDivPlayer").html(str)
                            setTimeout(() => {
                                let _videoPlayer = new EZUIPlayer('myPlayer');
                                _videoPlayer.play();
                            },100)
                        })
                    }


                },
                control_command(val) {
                    // let param = {
                    //     serial: '',//设备序列号
                    //     channel: '',//通道号
                    //     command: val
                    // }
                    // $.ajax({
                    //     url: '/api/v1/ptz/control',
                    //     type: 'Get',
                    //     dataType: "json",
                    //     data: param,
                    //     async: !0,
                    //     timeout: 60000,
                    //     crossDomain: !0,
                    //     cache: !1,
                    //
                    //     success: (e, t, i) => {
                    //         console.log(e)
                    //     },
                    //     error: () => {
                    //         this.$message.error('此设备不支持控制');
                    //     }
                    // })
                    this.lastOptions = val == 'stop' ? this.lastOptions : val;
                    this.lastpresetIndex = val == 'stop' ? this.lastpresetIndex : parseInt(Math.random() * 300);
                    let param = {
                        cameraCode: this.sel_video.Url2,
                        action: val == 'stop' ? 1 : 0,
                        command: this.lastOptions,
                        presetIndex: this.lastpresetIndex,
                    }
                    HttpUtil.get('HikVideo/cameraControl', param).success((r) => {

                    })

                },
                video_back() {
                    this.video_HisVisible = true;
                    // let param = {
                    //     serial: '34020000001320000105',//设备序列号
                    //     code: '34020000001320000001',//通道号
                    //     starttime: '2020-05-11T15:00:00',
                    // endtime: '2020-05-11T20:00:00',
                    //     // starttime: this.video_time
                    // }
                    // $.ajax({
                    //     url: '/api/v1/playback/info',
                    //     type: 'Get',
                    //     dataType: "json",
                    //     data: param,
                    //     async: !0,
                    //     timeout: 60000,
                    //     crossDomain: !0,
                    //     cache: !1,
                    //
                    //     success: (e, t, i) => {
                    //         this.video_back_list = e.RecordList;
                    //     },
                    //     error: () => {
                    //         this.$message.error('未找到录像');
                    //     },
                    // })
                    let param = {
                        cameraCode: this.sel_video.Url2,
                        beginTime: this.video_time + ' 00:00:00',
                        endTime: this.video_time + ' 23:59:59',
                    }
                    HttpUtil.get('HikVideo/playbackURLs', param).success((res) => {

                               this.back_list = res.data.list;
                               this.back_url = res.data.url
                    })
                },
                video_back_play(row) {
                    this.video_playVisible = true;
                    let beginTime = row.beginTime;
                    let endTime = row.endTime;
                    beginTime =  beginTime.replace('+08:00','');
                    beginTime = beginTime.replace(/:/g,'');
                    beginTime = beginTime.replace(/-/g,'');
                    endTime=endTime.replace('+08:00','');
                    endTime=endTime.replace(/:/g,'');
                    endTime=endTime.replace(/-/g,'');
                    setTimeout(()=>{

                        let url = this.back_url + '?beginTime='+beginTime+'&endTime='+endTime+'&playBackMode=1';
                        let str = '<video id="myPlayer2" style=" height: 100%;width:100%;min-width:320px;min-height:500px;" poster="" controls playsInline webkit-playsinline autoplay><source src="' + url + '" type="application/x-mpegURL" /></video>';
                        $("#backPlayer").html(str);
                        setTimeout(() => {
                            let _videoPlayer = new EZUIPlayer('myPlayer2');
                            _videoPlayer.play();
                        }, 10)
                    },10)



                },
                handleBackClose(done) {
                    $('#backPlayer').html('');
                    done();
                },
                contingency() {
                    this.contingencyVisible = true;
                    HttpUtil.get('project/list', {projectNo: this.sel_pro.projectNo}).success((res) => {
                        this.prodata = res.data[0];
                    })
                    HttpUtil.get('Risksource/List', {projectNo: this.sel_pro.projectNo, pagesize: 200}).success((res) => {
                        this.dangerous_data = res.data;
                    })
                    this.page_url = '../'

                },
                chemicals_detail() {
                    this.chemicalsVisible = true;
                },
                handleCommand(command) {
                    this.iframeVisible = true;
                    switch (command) {
                        case "bast_danger":
                            this.page_url = 'bast_danger.html';
                            break;
                        case "danger_count":
                            this.page_url = 'danger_count.html';
                            break;
                        case "company_danger_count":
                            this.page_url = 'company_danger_count.html';
                            break;
                        case "danger_trends":
                            this.page_url = 'danger_trends.html';
                            break;
                        case 'today_alarm':
                            this.iframeVisible = false;
                            this.getReport();
                            break;
                        case 'company_assess':
                            this.iframeVisible = false;
                            this.company_visible = true;
                            this.assess_param.date = TimeUtil.convertToString(new Date()).substr(0, 7);
                            this.getCompany_Assessment();
                            break;
                        case 'provider_assess':
                            this.page_url = 'provider_assess.html';
                            break;
                        case 'alarm_analysis':
                            this.page_url = 'alarm_analysis.html';
                            break;
                        case 'alarm_list':
                            this.page_url = '../warning-manage/alarm-list.html';
                            break;
                        case 'dev_list':
                            this.page_url = '../device-monitor/devMonitor.html';
                            break;
                        case 'notice_list':
                            this.page_url = 'notice_list.html';
                            break;
                        case 'accident_count':
                            this.page_url = 'safehitch_grade_count.html';
                            break;
                        case 'warning':
                            this.page_url = 'warningbill_all.html';
                            break;
                        case 'zone_patrol':
                            this.iframeVisible = false;
                            this.zone_partrol_visible = true;
                            break;
                        default:
                            this.page_url = '../../404/index.html';
                            break;
                    }
                },
                getCompany_Assessment() {
                    this.assess_param.year = this.assess_param.date.split('-')[0]
                    this.assess_param.month = this.assess_param.date.split('-')[1];
                    this.assess_param.zone = this.assess_param.zone == '全部' ? '' : this.assess_param.zone;
                    HttpUtil.get('GovStatistics/getCompanyEvaluateMonth', this.assess_param).success((r) => {
                        if (r.state == 0) {
                            this.company_assess_data = r.data;
                            this.assess_param.total = r.total;
                        }
                    })

                    HttpUtil.get('GovStatistics/getCompanyNumberByZone', {}).success((res) => {
                        let company_danger_count = {
                            ones: 0,
                            twos: 0,
                            threes: 0,
                            fours: 0,
                        }
                        for (let item of res.data) {
                            company_danger_count.ones += item.one;
                            company_danger_count.twos += item.two;
                            company_danger_count.threes += item.three;
                            company_danger_count.fours += item.four;
                        }
                        this.company_danger_count = company_danger_count;
                    })
                },
                companyAssessSearch() {
                    this.assess_param.pageno = 1;
                    this.getCompany_Assessment();
                },
                onAssessChangePage(page) {
                    this.assess_param.pageno = page;
                    this.getCompany_Assessment();
                },
                tableRowClassName({row, rowIndex}) {
                    if (rowIndex % 2 == 0) {
                        return 'warning-row';
                    } else {
                        return 'success-row';
                    }
                    return '';
                },
                tableHeaderClass() {
                    return 'dark-blue';
                },
                viewReport(row) {
                    this.sel_pro.projectNo = row.projectNo;
                    this.sel_pro.projectName = row.projectName;
                    this.showProDetail(row.projectNo);
                },
                viewCode(row) {
                    this.qrcodeVisible = true;
                    setTimeout(() => {
                        $('#qrcodeImg').empty();
                        $('#qrcodeImg').qrcode(row.projectNo);
                    }, 0)
                },
                dev_real(val) {
                    this.getDeviceData({deviceId: val,isEnvir:1});
                    this.devVisible = true;
                },
                getDeviceData(params) {
                    HttpUtil.get('device/getById', params).success((res) => {
                        this.device = res.data;
                        HttpUtil.get('device/Monitor', params).success((res) => {
                            this.paramData = res.data
                            this.getChart('realChart', this.paramData[0]);
                        })
                    })
                },
                loadDeviceParam(index) {
                    this.index = index;
                    this.getChart('realChart', this.paramData[index]);
                },
                getChart: function (id, data) {
                    let myChart = echarts.init(document.getElementById(id));
                    var option = {
                        tooltip: {},
                        toolbox: {
                            feature: {
                                restore: {},
                                saveAsImage: {}
                            }
                        },
                        series: [
                            {
                                name: data.dp_name,
                                type: 'gauge',
                                min: 0,
                                max: data.dp_value * 1.4,
                                splitNumber: 8,
                                detail: {formatter: data.dp_value + data.dp_unitid},
                                data: [{value: data.dp_value, name: data.dp_name}],
                                radius: "100%", //仪表大小
                            }
                        ]
                    };
                    myChart.setOption(option);
                },
                dev_history(val) {
                    setTimeout(() => {
                        this.hisVisible = true;
                        this.deviceId = val;
                        this.day = TimeUtil.convertToString(new Date()).substr(0, 10);
                        this.getDeviceHis();
                    }, 10)
                },
                dateChange(date) {
                    this.day = date;
                    this.paramIndex = 0;
                    this.getDeviceHis();
                },
                hisClick(key) {
                    this.paramIndex = key;
                    let chartData = {
                        title: this.hisData.fields[key].title,
                        yData: [],
                        xData: [],
                        unit: this.hisData.fields[key].unit,
                    };
                    let list = this.hisData;
                    for (let ind in list.values) {
                        chartData.yData.push(list.values[ind][this.hisData.fields[key].name]);
                        chartData.xData.push(list.values[ind].lastUpdate.split('T')[1])
                    }
                    this.drawChart(chartData);
                },
                getDeviceHis() {
                    HttpUtil.get('device/hisData', {
                        deviceNo: this.deviceId,
                        pagesize: 2888,
                        dat: this.day,
                        isEnvir:1
                    }).success((res) => {
                        res.data.fields=[
                            {"name":"UA","title":"A相电压","unit":"V"},
                            {"name":"UB","title":"B相电压","unit":"V"},
                            {"name":"UC","title":"C相电压","unit":"V"},
                            {"name":"IA","title":"A相电流","unit":"A"},
                            {"name":"IB","title":"B相电流","unit":"A"},
                            {"name":"IC","title":"C相电流","unit":"A"},
                            {"name":"I_Zero","title":"漏电流","unit":"mA"},
                            {"name":"PA","title":"A相功率","unit":"KW"},
                            {"name":"PB","title":"B相功率","unit":"KW"},
                            {"name":"PC","title":"C相功率","unit":"KW"},
                            {"name":"PSum","title":"总功率","unit":"KW"},
                            {"name":"ESum","title":"总电能","unit":"KWh"},
                            {"name":"PFSum","title":"总功率因数","unit":""},
                            {"name":"SSum","title":"总视在功率","unit":"KVA"},
                            {"name":"EA","title":"A相电能","unit":"KWh"},
                            {"name":"EB","title":"B相电能","unit":"KWh"},
                            {"name":"EC","title":"C相电能","unit":"KWh"},
                            {"name":"Temp1","title":"温度1","unit":"℃"},
                            {"name":"Temp2","title":"温度2","unit":"℃"},
                            {"name":"Temp3","title":"温度3","unit":"℃"},
                            {"name":"Temp4","title":"温度4","unit":"℃"},
                        ]
                        this.hisData = res.data;
                        this.hisClick(0);
                    })
                },
                drawChart(data) {
                    let options = {
                        toolbox: {
                            show: true,
                            feature: {
                                dataView: {readOnly: false},
                                magicType: {type: ['line', 'bar']},
                                restore: {},
                                saveAsImage: {}
                            },
                            iconStyle: {
                                color: 'white'
                            }
                        },
                        title: {
                            left: 'center',
                            text: data.title,
                            textStyle: {

                                color: '#FFFFFF' //

                            },
                        },

                        tooltip: {
                            trigger: 'axis',
                        },
                        grid: {
                            top: '12%',
                            left: '1%',
                            right: '10%',
                            containLabel: true
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: data.xData,
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                name: '单位' + data.unit,
                                nameTextStyle:{
                                  color:'#ffffff'
                                },
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            }
                        ],

                        dataZoom: [
                            {
                                show: true,
                                start: 94,
                                end: 100
                            },
                            {
                                type: 'inside',
                                start: 94,
                                end: 100,
                            },
                            {
                                show: false,
                                yAxisIndex: 0,
                                filterMode: 'empty',
                                width: 30,
                                height: '80%',
                                showDataShadow: false,
                                left: '93%'
                            }
                        ],
                        series: [
                            {
                                type: 'line',
                                data: data.yData,
                                name: '时间：' + data.title,
                                // markLine: {
                                //     silent: true,
                                //     lineStyle: {
                                //         normal: {
                                //             color: 'red'                   // 这儿设置安全基线颜色
                                //         }
                                //     },
                                //     data: [{
                                //         yAxis:270
                                //     }],
                                //     label: {
                                //         normal: {
                                //             formatter: '报警\n基线'           // 这儿设置安全基线
                                //         }
                                //     },
                                // },
                            },
                        ],
                    };
                    let myChart = echarts.init(document.getElementById('hisChart'));
                    myChart.setOption(options);
                },


                month_Error() {
                    //时段用量
                    HttpUtil.get('Screen/dayStatictis', {}).success((res) => {
                        //index9
                        let chartData = {
                            xdata: [],
                            ydata: [],
                        }
                        for (let key in res.data[0]) {
                            chartData.xdata.push(res.data[0][key].day);
                            chartData.ydata.push(res.data[0][key].dangerous + res.data[0][key].handy);
                            // chartData.ydata.handy.push(res.data[0][key].handy);
                            // chartData.ydata.dangerous.push(res.data[0][key].dangerous);
                        }
                        let myChart = echarts.init(document.getElementById('main'));
                        // 指定图表的配置项和数据
                        let option = {
                            toolbox: {
                                show: true,
                                feature: {
                                    dataView: {readOnly: false},
                                    magicType: {type: ['line', 'bar']},
                                    restore: {},
                                    saveAsImage: {}
                                },
                                iconStyle: {
                                    color: 'white'
                                }
                            },
                            tooltip: {
                                trigger: "axis",
                            },
                            legend: {
                                itemWidth: 15,
                                itemHeight: 15,
                                textStyle: {
                                    color: '#FFFFFF',
                                }
                            },
                            xAxis: {
                                data: chartData.xdata,
                                splitLine: {
                                    show: false,
                                },
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            },
                            yAxis: {
                                splitLine: {
                                    show: false,
                                },
                                axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#FFFFFF' //
                                    }
                                },
                            },
                            series: [{
                                name: '隐患',
                                type: 'line',
                                data: chartData.ydata,
                                itemStyle: {
                                    normal: {color: "red"},
                                }
                            }]
                        };
                        // 使用刚指定的配置项和数据显示图表。
                        myChart.setOption(option);
                        setTimeout(function () {
                            window.onresize = function () {
                                myChart.resize();
                            }
                        }, 10)
                    })
                },
            },

            watch: {}
            ,
            mounted: function () {
                $('.notice li:even').addClass('lieven');
                $("div .notice").myScroll({
                    speed: 80, //数值越大，速度越慢
                    rowHeight: 60 //li的高度
                });
                this.month_Error();
                this.height = window.innerHeight;
                // HttpUtil.get('Analysis/getUserProjectErrorGroupSummary',{UserId:SiteConfig.account.id,}).success((res)=>{
                //     //倒序
                //     res.data.sort(keysrt('Scoring',true,parseInt));
                //     this.tableAlarm = res.data;
                //
                // });
                HttpUtil.get('CodeController/BusinessList', {pageno: 1, pagesize: 200}).success((res) => {
                    this.businessArr = res.data;
                });
                this.imageUrl = SiteConfig.webApiset;
            }
        })
    ;

    function contingency() {
        vuePage.contingency();
    }

    function sendurgent(phone, manager) {
        vuePage.sendurgent(phone, manager);
    }

    function getRiskList(projectNo) {
        vuePage.getRiskList(projectNo);
    }

    function getTaskList(projectNo) {
        vuePage.getTaskList(projectNo);
    }

    function showProDetail(projectNo) {
        vuePage.showProDetail(projectNo);
    }

    function driving_marker() {
        vuePage.driving_marker();
    }

    // 排序方法
    function keysrt(filed, rev, primer) {
        rev = (rev) ? -1 : 1;
        return function (a, b) {
            a = a[filed];
            b = b[filed];
            if (typeof (primer) != 'undefined') {
                a = primer(a);
                b = primer(b);
            }
            if (a < b) {
                return rev * -1;
            }
            if (a > b) {
                return rev * 1;
            }
            return 1;
        }
    };
    // function showDetail() {
    //     vuePage.getDeviceData();
    // }
</script>

</body>
</html>
